JSFiddle

  • jQuery.triggerHandler

    jQuery 1.7.1, HTML, CSS, JavaScript

    (function($, undefined){
    
        $(function(){
        
            var $body = $(document.body),
                notify = function(e) {
                    $body.append("<p>foo! (" + this.nodeName + ")</p>");
                };
            
            $body.on('foo', notify)
                .parent ...
  • Parallax Scrolling Background (no deps)

    1/3 Scrolling of background compared to foreground. Using a background-image for performance

    $(function(){
        var $document = $(document),
            $background = $('#background'),
            moveBackground = function() {
                var so = $document.scrollTop();
                $background.css('top', (-so/3) + "px");
            };
        
        $(window).on ...
  • Link to Heading #4 is the latest revision

    jQuery 1.7, HTML, CSS, JavaScript

    var anchorTransitionEnd = function(e) {
            $(this).remove();
        },
        events = {
        mouseenter: function(e) {
            if (!this.id) {
                return;
            }
            
            $('#anchorLink').remove();
            
            var $this = $(this);
            var ...
  • Parallax Scrolling Background (Image) #9 is the latest revision

    1/3 Scrolling of background compared to foreground. Using a background-image for performance

    var $document = $(document),
        $background = $('#background'),
        moveBackground = function() {
            var so = $document.scrollTop();
            $background.css('top', (-so/3) + "px");
        };
    
    $(window).on('scroll ...
  • Parallax Scrolling Background

    1/3 Scrolling of background compared to foreground. Using CSS3 gradients for compositing background

    var $document = $(document),
        $background = $('#background'),
        moveBackground = function() {
            var so = $document.scrollTop();
            $background.css('top', (-so/3) + "px");
        };
    
    $(window).on('scroll ...
  • scale according to scroll position

    jQuery 1.7, HTML, CSS, JavaScript

    var $header = $('body > header'),
        $offset = $('#offset'),
        $document = $(document),
        scroll = {
            min: 100,
            max: 200
        },
        current = null,
        size = {
            min: 10,
            max: parseInt ...
  • jQuery.dataAttr() #9 is the latest revision

    using jQuery.data() so it's selectable by CSS

    (function($, undefined) {
    if (!$.uncamelCase) {
        // Convert camelCase to dashed
        $.uncamelCase = function(string) {
            return string.replace( /([A-Z])/g, '-$1' )
                .toLowerCase().replace( /^-/, '');
        };
    }
    
    // dispatch ...