讓WordPress 部落格利用jquery實現圖片顯隱特效

    <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.3.min.js"></script>

內鏈格式為：

    <script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.min.js" ></script>

然後再在header.php中加入：

——————————————————————————–
【文章標題】: 讓WordPress 部落格利用jquery實現圖片顯隱特效
【文章作者】: 部落格架站、行銷、賺錢術教學密訓基地
【作者信箱】: ster168ster@gmail.com
【作者首頁】: https://por.tw/blog/
【部落格架站、行銷、賺錢術教學課程】: https://por.tw/blog/E_learning/index.php
【基地主機】: http://goto1688.com/blog/
【版權聲明】: （原創）部落格架站、行銷、賺錢術教學密訓基地，轉載必須保留完整標頭。刪除者依法追究！
——————————————————————————–
儲存後，重整一下頁面看看效果如何。上面的代碼是使頁面中所有的圖片都具有顯隱特效，你也可以在上面的代碼中加入選取器，讓特定Div容器中的圖片具有顯隱特效，修改('img')為例如('.thumbnail img,.entry img')。
上面的特效是滑鼠懸停到圖片上時，圖片變得透明，我目前用的主題採用的就是上面代碼，還有一種是滑鼠懸停到圖片上時，圖片變得清晰，我製作的HotNews pro2.1主題隨機日誌縮略圖採用是這種效果，代碼如下：

    <script type="text/javascript">
    $(function() {
    $('img').animate({"opacity": .5 });

    $('img').hover(function() {
    $(this).stop().animate({ "opacity": 1 });
    }, function() {
    $(this).stop().animate({ "opacity": .5 });
    });
    });
    </script>