English 中文(简体)
采用Kokry Scroll 追捕 Cook花 with
原标题:Using Jquery Scroll Follow plugin with Cookie plugin
  • 时间:2009-10-08 19:43:47
  •  标签:

I m使用Jquery Scroll 后续行动金,使一个箱子能够作为网站的用户浏览器。 浏览跟踪使用户能够分辨或能够利用滚动特征,并使用gin子来纪念用户选择的网页。

浏览仪运行良好,但当用户首先进入现场时,该代码使滚动功能消失。 如果用户首先进入该网站,我就象违约一样是残疾的,从而使用户能够选择进行滚动。

我试图与 co鱼的真正/宝贵环境一道玩.,但我无法适当工作。 I m 包括以下的法典,并赞赏任何帮助改变违约状态,使之不会roll。

I ve tried asking for help on the developer s site, but have received no response: link text

感谢。

/**
 * jquery.scrollFollow.js
 * Copyright (c) 2008 Net Perspective (http://kitchen.net-perspective.com/)
 * Licensed under the MIT License (http://www.opensource.org/licenses/mit-license.php)
 * 
 * @author R.A. Ray
 *
     * @projectDescription  jQuery plugin for allowing an element to animate down as the user scrolls the page.
 * 
 * @version 0.4.0
 * 
 * @requires jquery.js (tested with 1.2.6)
 * @requires ui.core.js (tested with 1.5.2)
 * 
 * @optional jquery.cookie.js (http://www.stilbuero.de/2006/09/17/cookie-plugin-for-jquery/)
 * @optional jquery.easing.js (http://gsgd.co.uk/sandbox/jquery/easing/ - tested with 1.3)
 * 
 * @param speed     int - Duration of animation (in milliseconds)
 *                              default: 500
 * @param offset            int - Number of pixels box should remain from top of viewport
 *                              default: 0
 * @param easing        string - Any one of the easing options from the easing plugin - Requires jQuery Easing Plugin < http://gsgd.co.uk/sandbox/jquery/easing/ >
 *                              default:  linear 
 * @param container string - ID of the containing div
 *                              default:     box s immediate parent
 * @param killSwitch    string - ID of the On/Off toggle element
  *                                     default:  killSwitch 
 * @param onText        string - killSwitch text to be displayed if sliding is enabled
 *                                  default:  Turn Slide Off 
 * @param offText       string - killSwitch text to be displayed if sliding is disabled
 *                                  default:  Turn Slide On 
 * @param relativeTo    string - Scroll animation can be relative to either the  top      or  bottom  of the viewport
  *                                 default:  top 
 * @param delay         int - Time between the end of the scroll and the beginning of the animation in milliseconds
 *                              default: 0
 */

( function( jQuery ) {

jQuery.scrollFollow = function ( box, options )
{ 
    // Convert box into a jQuery object
    box = jQuery( box );

    //  box  is the object to be animated
    var position = box.css(  position  );

    function ani()
    {       
        // The script runs on every scroll which really means many times during a scroll.
        // We don t want multiple slides to queue up.
        box.queue( [ ] );

        // A bunch of values we need to determine where to animate to
        var viewportHeight = parseInt( jQuery( window ).height() ); 
        var pageScroll =  parseInt( jQuery( document ).scrollTop() );
        var parentTop =  parseInt( box.cont.offset().top );
        var parentHeight = parseInt( box.cont.attr(  offsetHeight  ) );
        var boxHeight = parseInt( box.attr(  offsetHeight  ) + ( parseInt( box.css(  marginTop  ) ) || 0 ) + ( parseInt( box.css(  marginBottom  ) ) || 0 ) );
        var aniTop;

        // Make sure the user wants the animation to happen
        if ( isActive )
        {
            // If the box should animate relative to the top of the window
            if ( options.relativeTo ==  top  )
            {
                // Don t animate until the top of the window is close enough to the top of the box
                if ( box.initialOffsetTop >= ( pageScroll + options.offset ) )
                {
                    aniTop = box.initialTop;
                }
                else
                {
                    aniTop = Math.min( ( Math.max( ( -parentTop ), ( pageScroll - box.initialOffsetTop + box.initialTop ) ) + options.offset ), ( parentHeight - boxHeight - box.paddingAdjustment ) );
                }
            }
            // If the box should animate relative to the bottom of the window
            else if ( options.relativeTo ==  bottom  )
            {
                // Don t animate until the bottom of the window is close enough to the bottom of the box
                if ( ( box.initialOffsetTop + boxHeight ) >= ( pageScroll + options.offset + viewportHeight ) )
                {
                    aniTop = box.initialTop;
                }
                else
                {
                    aniTop = Math.min( ( pageScroll + viewportHeight - boxHeight - options.offset ), ( parentHeight - boxHeight ) );
                }
            }

            // Checks to see if the relevant scroll was the last one
            // "-20" is to account for inaccuracy in the timeout
            if ( ( new Date().getTime() - box.lastScroll ) >= ( options.delay - 20 ) )
            {
                box.animate(
                    {
                        top: aniTop
                    }, options.speed, options.easing
                );
            }
        }
    };

    // For user-initiated stopping of the slide
    var isActive = true;

    if ( jQuery.cookie != undefined )
    {
        if( jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ) ) ==  false  )
        {
            var isActive = false;

            jQuery(  #  + options.killSwitch ).text( options.offText )
                .toggle( 
                    function ()
                    {
                        isActive = true;

                        jQuery( this ).text( options.onText );

                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), true, { expires: 365, path:  / } );

                        ani();
                    },
                    function ()
                    {
                        isActive = false;

                        jQuery( this ).text( options.offText );

                        box.animate(
                            {
                                top: box.initialTop
                            }, options.speed, options.easing
                        );  

                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), false, { expires: 365, path:  / } );
                    }
                );
        }
        else
        {
            jQuery(  #  + options.killSwitch ).text( options.onText )
                .toggle( 
                    function ()
                    {
                        isActive = false;

                        jQuery( this ).text( options.offText );

                        box.animate(
                            {
                                top: box.initialTop
                            }, 0
                        );  

                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), false, { expires: 365, path:  / } );
                    },
                    function ()
                    {
                        isActive = true;

                        jQuery( this ).text( options.onText );

                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), true, { expires: 365, path:  / } );

                        ani();
                    }
                );
        }
    }

    // If no parent ID was specified, and the immediate parent does not have an ID
    // options.container will be undefined. So we need to figure out the parent element.
    if ( options.container ==   )
    {
        box.cont = box.parent();
    }
    else
    {
        box.cont = jQuery(  #  + options.container );
    }

    // Finds the default positioning of the box.
    box.initialOffsetTop =  parseInt( box.offset().top );
    box.initialTop = parseInt( box.css(  top  ) ) || 0;

    // Hack to fix different treatment of boxes positioned  absolute  and  relative 
    if ( box.css(  position  ) ==  relative  )
    {
        box.paddingAdjustment = parseInt( box.cont.css(  paddingTop  ) ) + parseInt( box.cont.css(  paddingBottom  ) );
    }
    else
    {
        box.paddingAdjustment = 0;
    }

    // Animate the box when the page is scrolled
    jQuery( window ).scroll( function ()
        {
            // Sets up the delay of the animation
            jQuery.fn.scrollFollow.interval = setTimeout( function(){ ani();} , options.delay );

            // To check against right before setting the animation
            box.lastScroll = new Date().getTime();
        }
    );

    // Animate the box when the page is resized
    jQuery( window ).resize( function ()
        {
            // Sets up the delay of the animation
            jQuery.fn.scrollFollow.interval = setTimeout( function(){ ani();} , options.delay );

            // To check against right before setting the animation
            box.lastScroll = new Date().getTime();
        }
    );

    // Run an initial animation on page load
    box.lastScroll = 0;

    ani();
};

jQuery.fn.scrollFollow = function ( options )
{
    options = options || {};
    options.relativeTo = options.relativeTo ||  top ;
    options.speed = options.speed || 500;
    options.offset = options.offset || 0;
    options.easing = options.easing ||  swing ;
    options.container = options.container || this.parent().attr(  id  );
    options.killSwitch = options.killSwitch ||  killSwitch ;
    options.onText = options.onText ||  Turn Slide Off ;
    options.offText = options.offText ||  Turn Slide On ;
    options.delay = options.delay || 0;

    this.each( function() 
        {
            new jQuery.scrollFollow( this, options );
        }
    );

    return this;
};
})( jQuery );
最佳回答

Sorry, forgot about this post. 我试图与 co合,认为我找到了可行的解决办法。 至少为我工作。 希望有助于任何人。 下载次数与原件比较。

( function( jQuery ) {

jQuery.scrollFollow = function ( box, options )
{ 
    // Convert box into a jQuery object
    box = jQuery( box );

    //  box  is the object to be animated
    var position = box.css(  position  );

    function ani()
    {       
        // The script runs on every scroll which really means many times during a scroll.
        // We don t want multiple slides to queue up.
        box.queue( [ ] );

        // A bunch of values we need to determine where to animate to
        var viewportHeight = parseInt( jQuery( window ).height() ); 
        var pageScroll =  parseInt( jQuery( document ).scrollTop() );
        var parentTop =  parseInt( box.cont.offset().top );
        var parentHeight = parseInt( box.cont.attr(  offsetHeight  ) );
        var boxHeight = parseInt( box.attr(  offsetHeight  ) + ( parseInt( box.css(  marginTop  ) ) || 0 ) + ( parseInt( box.css(  marginBottom  ) ) || 0 ) );
        var aniTop;

        // Make sure the user wants the animation to happen
        if ( isActive )
        {
            // If the box should animate relative to the top of the window
            if ( options.relativeTo ==  top  )
            {
                // Don t animate until the top of the window is close enough to the top of the box
                if ( box.initialOffsetTop >= ( pageScroll + options.offset ) )
                {
                    aniTop = box.initialTop;
                }
                else
                {
                    aniTop = Math.min( ( Math.max( ( -parentTop ), ( pageScroll - box.initialOffsetTop + box.initialTop ) ) + options.offset ), ( parentHeight - boxHeight - box.paddingAdjustment ) );
                }
            }
            // If the box should animate relative to the bottom of the window
            else if ( options.relativeTo ==  bottom  )
            {
                // Don t animate until the bottom of the window is close enough to the bottom of the box
                if ( ( box.initialOffsetTop + boxHeight ) >= ( pageScroll + options.offset + viewportHeight ) )
                {
                    aniTop = box.initialTop;
                }
                else
                {
                    aniTop = Math.min( ( pageScroll + viewportHeight - boxHeight - options.offset ), ( parentHeight - boxHeight ) );
                }
            }

            // Checks to see if the relevant scroll was the last one
            // "-20" is to account for inaccuracy in the timeout
            if ( ( new Date().getTime() - box.lastScroll ) >= ( options.delay - 20 ) )
            {
                box.animate(
                    {
                        top: aniTop
                    }, options.speed, options.easing
                );
            }
        }
    };

    // For user-initiated stopping of the slide
    var isActive = false;

    if ( jQuery.cookie != undefined )
    {
        if( jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ) ) ==  true  )
        {
            var isActive = true;

            jQuery(  #  + options.killSwitch ).text( options.onText )
                .toggle( 
                    function ()
                    {
                        isActive = false;

                        jQuery( this ).text( options.offText );

                        box.animate(
                            {
                                top: box.initialTop
                            }, options.speed, options.easing
                        );  

                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), false, { expires: 365, path:  / } );


                    },
                    function ()
                    {
                        isActive = true;

                        jQuery( this ).text( options.onText );



                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), true, { expires: 365, path:  / } );
                        ani();
                    }
                );
        }
        else
        {
            jQuery(  #  + options.killSwitch ).text( options.offText )
                .toggle( 
                    function ()
                    {
                        isActive = true;

                        jQuery( this ).text( options.onText );



                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), true, { expires: 365, path:  / } );
                        ani();
                    },
                    function ()
                    {
                        isActive = false;

                        jQuery( this ).text( options.offText );

                        box.animate(
                            {
                                top: box.initialTop
                            }, 0
                        );  

                        jQuery.cookie(  scrollFollowSetting  + box.attr(  id  ), false, { expires: 365, path:  / } );


                    }
                );
        }
    }

    // If no parent ID was specified, and the immediate parent does not have an ID
    // options.container will be undefined. So we need to figure out the parent element.
    if ( options.container ==   )
    {
        box.cont = box.parent();
    }
    else
    {
        box.cont = jQuery(  #  + options.container );
    }

    // Finds the default positioning of the box.
    box.initialOffsetTop =  parseInt( box.offset().top );
    box.initialTop = parseInt( box.css(  top  ) ) || 0;

    // Hack to fix different treatment of boxes positioned  absolute  and  relative 
    if ( box.css(  position  ) ==  relative  )
    {
        box.paddingAdjustment = parseInt( box.cont.css(  paddingTop  ) ) + parseInt( box.cont.css(  paddingBottom  ) );
    }
    else
    {
        box.paddingAdjustment = 0;
    }

    // Animate the box when the page is scrolled
    jQuery( window ).scroll( function ()
        {
            // Sets up the delay of the animation
            jQuery.fn.scrollFollow.interval = setTimeout( function(){ ani();} , options.delay );

            // To check against right before setting the animation
            box.lastScroll = new Date().getTime();
        }
    );

    // Animate the box when the page is resized
    jQuery( window ).resize( function ()
        {
            // Sets up the delay of the animation
            jQuery.fn.scrollFollow.interval = setTimeout( function(){ ani();} , options.delay );

            // To check against right before setting the animation
            box.lastScroll = new Date().getTime();
        }
    );

    // Run an initial animation on page load
    box.lastScroll = 0;

    ani();
};

jQuery.fn.scrollFollow = function ( options )
{
    options = options || {};
    options.relativeTo = options.relativeTo ||  top ;
    options.speed = options.speed || 500;
    options.offset = options.offset || 0;
    options.easing = options.easing ||  swing ;
    options.container = options.container || this.parent().attr(  id  );
    options.killSwitch = options.killSwitch ||  killSwitch ;
    options.onText = options.onText ||  Turn Slide Off ;
    options.offText = options.offText ||  Turn Slide On ;
    options.delay = options.delay || 0;

    this.each( function() 
        {
            new jQuery.scrollFollow( this, options );
        }
    );

    return this;
};

})( jQuery );

问题回答

我在“滚动灯”和“我的滚动后继功能”网页上添加了另一条旗帜,称为“不履行”的另一种选择。

var firstSetting = true;

if (firstSetting) {
    isActive = false;
    $( #  + options.killSwitch).html(options.defaultText);
    firstSetting = false;
}

它为我工作





相关问题
热门标签