prettyphotoやlightBoxなどの画像ポップアップで画像が下に潜る場合の対策

prettyphotoやlightBoxなどの画像ポップアップで画像が下に潜る場合の対策方法

●問題：
prettyphotoやlightBoxなどの画像ポップアップすると画像が下に潜る
・拡大した画像が、画面下部のYouTube に重なると潜り込んでしまう。
・ブラウザは、Chrome では問題なし。IE10、FireFoxで問題発生（環境：Win7）
・動画によっては、潜り込まないものもある。
・z-indexという重なり順を指定するCSSでも対応不可
　　
●対策：
・埋め込みタグにコード追加：　&wmode=transparen

　例：<iframe width="350" height="197" src="//www.youtube.com/embed/（★＠動画アドレス）?rel=0&wmode=transparent" frameborder="0" allowfullscreen></iframe>

●結果：
　ブラウザ、Chrome 、IE10、FireFoxで問題なし（環境：Win7）

------------------------------------------------------------------------

対策方法があって良かったです。

jQuery「ページトップへ戻るボタン」の作成方法

jQuery「ページトップへ戻るボタン」の作成方法

とても簡単です。

--------------------------------------------------

■HTML

<a id="pageTop" href="#contents">ページトップへ</a>

--------------------------------------------------

■CSS

#pageTop{
background:#DDD;
border-radius:5px;
color:#FFF;
padding:20px;
position:fixed;
bottom:20px;
right:20px;
}
#pageTop:hover{
background:#EEE;
}

--------------------------------------------------

■JavaScript

<script type="text/javascript">
$(function() {
var topBtn = $('#pageTop');
topBtn.hide();
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
topBtn.fadeIn();
} else {
topBtn.fadeOut();
}
});
    topBtn.click(function () {
$('body,html').animate({
scrollTop: 0
}, 1000);
return false;
    });
});
</script>

--------------------------------------------------

■備考

scrollに書いてある100は、画面の上部から100スクロールするとボタンを表示するという記述。
animateに書かれている1000は、1000（1秒）かけてページトップに戻るという記述。

--------------------------------------------------