jQueryで画像をフェードイン



2014-06-29_135400

プログラムコードをブログなどのWebページに掲載する場合に必要な処理や見た目を整えてくれる便利なライブラリ


記事の内容

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<img class="fadeimg" src="xxx.jpg" width="400" height="300" style="display: none;" />
<div class="fadebg" style="display: none; width: 400px; height: 300px; background-image: url(xxx.jpg); z-index: -1;"></div>

jQuery

$(function(){
$(".fadeimg").fadeIn(2000);
$(".fadebg").layer.css("background-image").fadeIn(2000); });
});

CSS3のみで実現する方法もあります。状況に応じて使い分けてください。


最新記事はトップページで!

京都発・地方が盛り上がるグルメや観光に撮影ロケ地の話題を提供!