日期:2014-05-16  浏览次数:20365 次

我在网上查到一个jquery的插件 没有没有注释 我有点看不明白 哪位大大给我写下注释下 谢谢了!
我找的是一个特效文本的插件 , 插件里面的代码我就不贴了 这是页面的jquery代码  才学习jquery没多久 看不太明白 希望哪位大大给写点注释!

$(function() {
     //得到section
    var $container = $('#ib-container'),$articles = $container.children('article'),timeout;
    
    $articles.on( 'mouseenter', function( event ) {
    
    var $article = $(this);
    clearTimeout( timeout );
    timeout = setTimeout( function() {
    
    if( $article.hasClass('active') ) {return false;}
    
    $articles.not( $article.removeClass('blur').addClass('active') ).removeClass('active').addClass('blur');
    
    }, 65 );
    
    });
    
    $container.on( 'mouseleave', function( event ) {
    
    clearTimeout( timeout );
    $articles.removeClass('active blur');
    
    });
});

------解决方案--------------------
闲着也是闲着,看到了就帮一下,jq的核心还是基础js,要想玩得转jq,还得深入的了解源生js。
就本人目前的水平,做以下的注释,仅供参考:

// 总加载
$(function () {
    //得到section
    // 以下得到三个变量,为了不出现多次 var ,每个变量中间用逗号分隔
    var $container = $('#ib-container'), // 这是外部容器
        $articles = $container.children('article'),// 这是容器里边所有的 article 儿子,不包括 aritcle 孙子,要是包括孙子,那就是 find,而不是 children
        timeout; // 这是一个计时器

    $articles.on('mouseenter', function (event) { // 当鼠标进入这个区域的时候
        var $article = $(this); // 缓存 $(this), 以便下次引用的时候更快的访问
        clearTimeout(timeout); // 清除 timeout
        timeout = setTimeout(function () {
            if ($article.hasClass('active')) { // 在 包含有 active 这个class的artilce上返回,就是效果不生效
                return false;
            }
            $articles.not($article.removeClass('blur').addClass('active')).removeClass('active').addClass('blur');
            // 这里可以分成两部分:
            // $article.removeClass('blur').addClass('active') : 针对 article 操作移除 blur, 添加 active class,
            // not($article.removeClass('blur').addClas