天天操天天干天天综合网,欧美精品aaa,日韩在线精品一区

[代碼] 圖片預加載

    
            01
            (function($) {
        
            02
              var cache = [];
        
            03
              // Arguments are image paths relative to the current page.
        
            04
              $.preLoadImages = function() {
        
            05
                var args_len = arguments.length;
        
            06
                for (var i = args_len; i--;) {
        
            07
                  var cacheImage = document.createElement('img');
        
            08
                  cacheImage.src = arguments[i];
        
            09
                  cache.push(cacheImage);
        
            10
                }
        
            11
              }
        
            12
             
            13
            jQuery.preLoadImages("image1.gif", "/path/to/image2.png");

[代碼] 在新窗口打開鏈接 (target=”blank”)

    
            1
            $('a[@rel$='external']').click(function(){
        
            2
                 this.target = "_blank";
        
            3
            });
        
            4
             
            5
            /*
        
            6
               Usage:
        
            7
               <a  rel="external">catswhocode.com</a>
        
            8
            */

[代碼] 當支持 JavaScript 時為 body 增加 class

    
            1
            /* 該代碼只有1行，但是最簡單的用來檢測瀏覽器是否支持 JavaScript 的方法，如果支持 JavaScript 就在 body 元素增加一個 hasJS 的 class */
        
            2
            $('body').addClass('hasJS');

[代碼] 平滑滾動頁面到某個錨點

    
            01
            $(document).ready(function() {
        
            02
                $("a.topLink").click(function() {
        
            03
                    $("html, body").animate({
        
            04
                        scrollTop: $($(this).attr("href")).offset().top + "px"
        
            05
                    }, {
        
            06
                        duration: 500,
        
            07
                        easing: "swing"
        
            08
                    });
        
            09
                    return false;
        
            10
                });
        
            11
            });

[代碼] 鼠標滑動時的漸入和漸出

    
            1
            $(document).ready(function(){
        
            2
                $(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads
        
            3
             
            4
                $(".thumbs img").hover(function(){
        
            5
                    $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
        
            6
                },function(){
        
            7
                    $(this).fadeTo("slow", 0.6); // This should set the opacity back to 60% on mouseout
        
            8
                });
        
            9
            });

[代碼] 制作等高的列

    
            1
            var max_height = 0;
        
            2
            $("div.col").each(function(){
        
            3
                if ($(this).height() > max_height) { max_height = $(this).height(); }
        
            4
            });
        
            5
            $("div.col").height(max_height);

[代碼] 在一些老的瀏覽器上啟用 HTML5 的支持

    
            01
            (function(){
        
            02
                if(!/*@cc_on!@*/0)
        
            03
                    return;
        
            04
                var e = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(','),i=e.length;while(i--){document.createElement(e[i])}
        
            05
            })()
        
            06
             
            07
            //然后在head中引入該js
        
            08
            <!--[if lt IE 9]>
        
            09
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        
            10
            <![endif]-->

[代碼] 測試瀏覽器是否支持某些 CSS3 屬性

    
            01
            var supports = (function() {
        
            02
               var div = document.createElement('div'),
        
            03
                  vendors = 'Khtml Ms O Moz Webkit'.split(' '),
        
            04
                  len = vendors.length;
        
            05
             
            06
               return function(prop) {
        
            07
                  if ( prop in div.style ) return true;
        
            08
             
            09
                  prop = prop.replace(/^[a-z]/, function(val) {
        
            10
                     return val.toUpperCase();
        
            11
                  });
        
            12
             
            13
                  while(len--) {
        
            14
                     if ( vendors[len] + prop in div.style ) {
        
            15
                        // browser supports box-shadow. Do what you need.
        
            16
                        // Or use a bang (!) to test if the browser doesn't.
        
            17
                        return true;
        
            18
                     }
        
            19
                  }
        
            20
                  return false;
        
            21
               };
        
            22
            })();
        
            23
             
            24
            if ( supports('textShadow') ) {
        
            25
               document.documentElement.className += ' textShadow';

[代碼] 獲取 URL 中傳遞的參數

    
            1
            $.urlParam = function(name){
        
            2
                var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
        
            3
                if (!results) { return 0; }
        
            4
                return results[1] || 0;
        
            5
            }

[代碼] 禁用表單的回車鍵提交

    
            1
            $("#form").keypress(function(e) {
        
            2
              if (e.which == 13) {
        
            3
                return false;
        
            4
              }
        
            5
            });

10 個很棒的 jQuery 代碼片段

代碼片段

[代碼] 圖片預加載

[代碼] 在新窗口打開鏈接 (target=”blank”)

[代碼] 當支持 JavaScript 時為 body 增加 class

[代碼] 平滑滾動頁面到某個錨點

[代碼] 鼠標滑動時的漸入和漸出

[代碼] 制作等高的列

[代碼] 在一些老的瀏覽器上啟用 HTML5 的支持

[代碼] 測試瀏覽器是否支持某些 CSS3 屬性

[代碼] 獲取 URL 中傳遞的參數

[代碼] 禁用表單的回車鍵提交

導航

統計

常用鏈接

留言簿(2)

隨筆檔案

文章檔案

搜索

最新評論

閱讀排行榜

評論排行榜


只有注冊用戶登錄后才能發表評論。




網站導航: 博客園 IT新聞 Chat2DB C++博客博問管理