zoukankan      html  css  js  c++  java
  • 关于JQuery(最后一点动画效果*)

    1,$(':radio').val(['1','2','3']);//特殊写法,把值为1 2 3的都选中。

    2,math.abs(len)取绝对值

    3,按钮高亮显示,一般是配置两个按钮,一个普通的,一个高亮度的(比如普通样式按钮坐标为100,100. 高亮样式按钮坐标为120,120),当鼠标经过,js改变css background-position:100 -100;动态变为120 -120。(至于为什么当你在很多网站要保存一个小图标,却保存成了很大的图片,就是因为网站的图标显示离痛了background-position这种方法)

    4,

    文字被鼠标选中的效果
    //1。扩展jQuery
    $.fn.selectRange = function (start, end) {
    var curObj = $(this).get(0);
    if (!curObj) return;
    else if (curObj.setSelectionRange) {
    curObj.focus(); curObj.setSelectionRange(start, end);
    } /* WebKit */
    else if (curObj.createTextRange) {
    var range = curObj.createTextRange();
    range.collapse(true);
    range.moveEnd('character', end);
    range.moveStart('character', start);
    range.select();
    } /* IE */
    else if (curObj.selectionStart) {
    curObj.selectionStart = start;
    curObj.selectionEnd = end;
    }
    };


    调用的时候直接调用selectRange方法
    .selectRange(1,7);
    //默认选中文字start到end 加载即选中

    5,javascript:void(0);不跳转

    6,$(this).parent().remove();

    7,

    //判断层是否已存在
    if($('#dv1').length==0){};

    8,

    .hover() //鼠标进入,鼠标离开
    $('#btn').hover(function() {
    $(this).css('background-color', 'red');
    }, function() {
    $(this).css('background-color', '');
    });

    9,

    //切换事件 ,toggle();
    $('#btn').toggle(function() {

    }, function() {

    }, function() {

    }, function() {

    });

    10,   01:在内层return false;可以阻止事件冒泡(推荐使用)

            02:function(e)

                e.stopPropagation();
              
    (标准用法)

                $('btn').click(function(e){

                if(!confirm('去不')){
                e.prevrntDefault();//阻止事件
                    } 
                });

    11,

    //在注册事件时候就传值
    $('#btn').click({'name':'小黑'},function(evt){
    alert(evt.data.name);
    });

    12,

    //延时隐藏和展示
    $(function () {
    $('#btnHide').click(function () {
    $('div').hide(1000);
    });
    $('#btnShow').click(function() {
    $('div').show(1000);
    });
    });

    13,***************动画效果

    首先脱离了文档流
    $('img').animate 
    ({"top":"550px","left":"10px","width":"50px","height":"50px"},1500) //这是图片最后的结果
    ; //渐变 从上落到据上面550px 并且逐渐变小
    //动画效果

  • 相关阅读:
    在小米 三星 索尼 手机 :图标上显示数字
    HDU 1873 看病要排队
    简单的WINFORM窗口,体验WINFORM带来的快感
    java初探秘之推断输入的一串字符是否全为小写字母
    【Android 面试基础知识点整理】
    互联网+时代IT管理者的转型
    hdu 1233 还是畅通project (克鲁斯卡尔裸题)
    经验之谈—让你看明确block
    字典树
    设计模式之问题集锦(一)
  • 原文地址:https://www.cnblogs.com/chenliyang/p/6595406.html
Copyright © 2011-2022 走看看