【jquery】追随、追尾型の広告やメニュー

追随、追尾型の広告やメニュー等に使いたい！
jquery　javascript
footerは下のフッターのクラス名やid、footerタグなど広告タグ手前に
.fixed-itemは実際広告を入れているクラス名などを入れる


$(function(){
var target = $(".fixed-item");
var footer = $("footer")
var targetHeight = target.outerHeight(true);
var targetTop = target.offset().top;

$(window).scroll(function(){
var scrollTop = $(this).scrollTop();
if(scrollTop > targetTop){
// 動的にコンテンツが追加されてもいいように、常に計算する
var footerTop = footer.offset().top;

if(scrollTop + targetHeight > footerTop){
customTopPosition = footerTop - (scrollTop + targetHeight)
target.css({position: "fixed", top: customTopPosition + "px"});
}else{
target.css({position: "fixed", top: "10px"});
}
}else{
target.css({position: "static", top: "auto"});
}
});
});




参考はコチラ→http://select-aster.com/web/auto-tracking-sidebar/

【CSS】文字を消す(隠す、非表示にする)

.text {
text-indent:100%;
white-space:nowrap;
overflow:hidden;
}

いまさらですが！
参考URL
http://ss-complex.com/2013/12/css-cleartext/

【html、css】レスポンシブWebデザイン参考url

@media(max-width:600px){
.mod-sampleBlock .mod-sampleBlock-image {
float:none;
margin:0 10px;
}
.mod-sampleBlock .mod-sampleBlock-image img{margin:0 auto;}
}

書き方参考

http://webdesignerwork.jp/web/responsivewebdesign/
http://yomotsu.net/blog/2012/10/01/mediaquery-goodpractice.html

【css3】1つの要素に背景画像とグラデーションを入れる

なんかうまくいかない…
同じdivに背景とグラデーションをかける…
どうやってかくの…！？
ってなったらここに答えが！！

.test06 {
background:url(img/a_link.png),-webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
background-repeat:no-repeat;
background-position:95% center;
}

素晴らしい！
詳しい解説、参考サイトはコチラ↓
http://html-five.jp/313/

【css】box-shadowが下のブロックにうまくかからない時

たとえばheader100%の下にbox-shadowを引いてすぐ下に
画像を置くとbox-shadowが隠れてしまうけれど、
そういう時は
「上の div に position: relative と z-index: 0; を追加」
すると解決。
重なり順を変えよう！