• Jquery技巧


    1、禁用页面的右键菜单

    $(document).ready(function(){
      $(document).bind("contextmenu",function(e){
        return false;
       });
     });

    2、新窗口打开页面

    $(document).ready(function(){
      $('a[href^="http://"]').attr("target","_blank");
      $("a[rel$='external']").click(function(){
        this.tatget="_blank";
        });
       });
    <a href="http://" rel="external">open link</a>

    3、判断浏览器类型

    $(document).ready(function(){
    //FireFox 2 and above
        if( $.browser.mozilla && $.browser.verdion >= "1.8"){
          //do nothing
          }
    //Safari
        if( $.browser.safari){
          //do nothing
          }
    //Chrome
        if( $.browser.chrome){
          //do nothing
          }
    //Opera
        if( $.browser.opera){
          //do nothing
          }
    //IE6 and below
        if( $.browser.msie && $.browser.version <= 6){
          //do nothing
          }
    //anything above IE6
        if( $.browser.msie && $.browser.version > 6){
          //do nothing
          }
    });

    4、输入框文字获取和失去焦点

    $(document).ready(function(){
        $("input.text1").val("Enter your search text here");
        textFill($('input.text1'));
    });
    function textFill(input){
        var originalvalue = input.val();
        input.focus( function(){
           if( $.trim(input.val()) == originalvalue){
          input.val(' ');
          } 
    }).blur(function(){
        if( $.trim(input.val()) == ' '){
          input.val(originalvalue);
          }   
    });
    }

    5、返回头部滑动动画

    jQuery.fn.scrollTo=function(speed){
      var targetOffset=$(this).offset().top;
      $('html.body').stop().animate({scrollTop: targetOffset}.speed);
      return this;
    };
    
    $("#goheader").click(function(){
      $("body").scrollTo(500);
      return false;
    });

    6、获取鼠标位置

    $(document).ready(function(){
      $(document).mousemove(function(e){
        $('#XY').html("X: " + e.pageX +" | Y : " + e.pageY);
      });
    });

    7、设置div在屏幕中央

    $(document).ready(function(){
    jQuery.fn.center = function(){
    this.css("position","absolute");
    this.css("top",($(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
    this.css("left",($(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
    return this;
    }
    
    $("#XY").center();
    });

    8、检测鼠标左右键

    $(document).ready(function(){
      $("#XY").mousedown(function(e){
        alert(e.which) 
      })
    });

    9、使用siblings来选择同辈元素

    $('#nav li').click(function(){
        $(this).addClass('active').sibilings().removeClass('active');
    });

    10、在一段时间后自动隐藏或关闭元素

    $("div").slideUp(300).delay(3000).fadeIn(400);
  • 相关阅读:
    关于JAVA中的static方法、并发问题以及JAVA运行时内存模型
    【设计模式】抽象工厂模式
    spring mvc4.1.6 + spring4.1.6 + hibernate4.3.11 + mysql5.5.25 开发环境搭建及相关说明
    struts2.3.24 + spring4.1.6 + hibernate4.3.11+ mysql5.5.25开发环境搭建及相关说明
    git中Please enter a commit message to explain why this merge is necessary.
    扒一扒开源世界有哪些licenses?
    string.Format出现异常:输入字符串的格式不正确 Exception during StringFormat
    node-glob学习
    js中对URL进行转码与解码
    程序员如何修炼管理思维
  • 原文地址:https://www.cnblogs.com/danznb/p/3504480.html
Copyright © 2020-2023  润新知