作者: admin

  • javascript判断浏览器是否支持placeholder

    js html5  判断 浏览器 支持 placeholder 支持

     

    placeholder是个HTML5新增属性,目前只有少数浏览器支持。placeholder大概就是占位符的意思吧,在可输入控件中,“占位符”一般作提示用,简洁明了,空间利用率高。这个属性确实是个好东西。只是不同的浏览器下表现的方式不一样,如IE下focus提示文字就消失了,火狐下是有按键才会消失。我是个懒惰主义者,这种问题我并不在乎。但是IE8是没有这个属性的,没办法谁让WIN7默认带的就是IE8呢?如何检测浏览器是否支持它呢?

    var hasPlaceholderSupport = function(){
      var input = document.createElement("input");
      return "placeholder" in input;
    }

    不支持会返回false

  • Adobe Dreamweaver CS6默认配色文件

    DW默认配色文件,防止乱修改颜色无法恢复

    路径:C:\Users\你用户名\AppData\Roaming\Adobe\Dreamweaver CS6\zh_CN\Configuration\CodeColoring\Colors.xml

    Colors

  • php+js数字动画

    js 数字 滚动 动画

    num_animate

    http://www.helloweba.com/demo/totalnum/

  • 响应式内容滑动插件bxSlider

    响应式 幻灯片 手机

    pc_mobile

    焦点图 幻灯片 兼容IE7/8,同时也支持手机手势切换

     

     

    bxSlider特性

    1.充分响应各种设备,适应各种屏幕;

    2.支持多种滑动模式,水平、垂直以及淡入淡出效果;

    3.支持图片、视频以及任意html内容;

    4.支持触摸滑动;

    5.支持Firefox,Chrome,Safari,iOS,Android,IE7+

    如何使用bxSlider

    1、首先是加载jQuery库,以及bxSlider插件文件和相关CSS文件,您可以从官方网站下载最新版本的bxSlider

    <link rel="stylesheet" type="text/css" href="jquery.bxslider.css"> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
    <script src="jquery.bxslider.min.js"></script> 
    

    2、准备滑动内容,我们创建一个ul.bxslider,然后在其子元素li中加入滑动内容,滑动内容可以是图片、视频以及任意html内容:

    <ul class="bxslider"> 
          <li><img src="images/s1.jpg" /></li> 
          <li><img src="images/s2.jpg" /></li> 
          <li><img src="images/s3.jpg" /></li> 
    </ul> 
    

    3、调用bxSlider插件,当页面内容加载完时调用bxSlider。

    $(function(){ 
        $('.bxslider').bxSlider(); 
    }); 
    

    这样,一个超酷的内容滑动效果就实现了,查看演示demo,将浏览器窗口放大和缩小可以看到滑动内容会随着浏览器窗口自动调整大小。bxSlider提供了丰富的配置选项,可以设置不同参数满足各种客户需求,来看它的选项配置。

    bxSlider选项设置

    bxSlider提供了丰富的选项可配置,以下我们列出最主要也是最常用的选项设置。

    参数 描述 默认值
    mode 设置滑动模式,’horizontal’:水平, ‘vertical’:垂直, ‘fade’:淡入淡出 horizontal
    speed 内容切换速度,数字,ms 500
    startSlide 初始滑动位置,数字 0
    randomStart 随机初始滑动位置 true
    infiniteLoop 循环滑动,如果设置为true时,则到最后滑动位置时会切换到初始位置 true
    easing 切换动画扩展,可以借助jQuery Easing 动画效果扩展设置不同的切换动画效果 null
    captions 设置显示图片标题,当滑动内容为图片时并设置属性title,可以显示图片标题 false
    video 支持视频,当设置为true时,需要jquery.fitvids.js支持 false
    pager 设置是否显示分页,设置为true时,会在滑动内容下方显示分页图标 true
    controls 设置是否显示上一副和下一幅按钮 true
    auto 设置是否自动滑动 false
    pause 自动滑动时停留时间,数字,ms 4000
    autoHover 当鼠标滑向滑动内容上时,是否暂停滑动 false

    更多bxSlider的选项设置,请参照bxSlider官网:http://bxslider.com/options

    http://www.helloweba.com/view-blog-219.html

    http://pan.baidu.com/s/1ntOScC5

    还有同款不错的幻灯片 虽然不支持手势但是也是响应式https://sdeno.com/?p=3668

  • jquery内置异步功能简单使用

    实用技巧:使用 jQuery 异步加载 JavaScript 脚本

     

    JavaScript 加载器在 Web 开发中是非常强大和有用的工具。目前流行的几个加载器,像 curljs、LABjs 和 RequireJS 使用都很广泛。他们功能强大的,但有些情况下可以有更简单的方案。

    如果你正在使用 jQuery,有一个内置的方法可以用来加载脚本。如果你想延迟加载插件或任何其他类型的脚本,都可以使用这种方法。下面给大家介绍如何使用它。

    jQuery 内置有 getScript 方法来加载一个脚本,处理返回的结果可以有几种方法来实现。最基本的用法 jQuery.getScript 看起来像这样:

    jQuery.getScript("/path/to/myscript.js", function(data, status, jqxhr) {
     
     /*
       在脚本已载入并执行后,就可以做一些处理了
     */ 
     
    });

    getScript 方法返回一个 jqXHR 对象,因此可以这样使用:

     jQuery.getScript("/path/to/myscript.js")
     .done(function() {
     /* 执行成功后的处理 */
     })
     .fail(function() {
     /* 执行失败后的处理 */
    });

    使用 jQuery.getScript 的最常见场景是延迟加载一个插件,并在加载后调用它:

     jQuery.getScript("jquery.cookie.js")
     .done(function() {
     jQuery.cookie("cookie_name", "value", { expires: 7 });
    });

     

    如果你需要做更高级的事情,如加载多个脚本和不同类型的文件(文本文件,图像,CSS 文件等),我建议你切换到一个功能更强大的 JavaScript 加载器。如果只想延迟加载插件,而不是简单地在每个页面加载的情况下,getScript 是完美的!

     

     

    缓存问题

    需要注意的是,当使用 jQuery.getScript 的时候,在脚本 URL 后面会自动被添加上时间戳,让脚本不缓存。因此你需要设置让所有的请求都缓存脚本:

    jQuery.ajaxSetup({
     cache: true
    });

    如果您不希望覆盖所有的缓存与你的 AJAX 请求,最好使用 jQuery.ajax 方法并把 dataType 设置为 script,例如这样:

    jQuery.ajax({
     url: "jquery.cookie.js",
     dataType: "script",
     cache: true
    }).done(function() {
     jQuery.cookie("cookie_name", "value", { expires: 7 });
    });

    在加载脚本的时候需要特别注意缓存问题!

    http://www.cnblogs.com/lhb25/p/loading-scripts-jquery.html