jQuery | Web Developer Blog

Get browser width include scrollbar

window.innerWidth

Get width of a hidden element

<style>
.element {display:none}
</style>

<script>
$(‘.element’).show();
var width = $(‘.element’).width();
$(‘.element’).hide();
</script>

Full Screen Ajax Loader

Reference: http://stackoverflow.com/questions/1964839/jquery-please-wait-loading-animation

Animated anchor on jScrollpane

$(‘.scrollpane’).jScrollPane({
animateScroll: true
});
var scrollpane_api = $(‘.scrollpane’).data(‘jsp’);

$(‘.scrollpane a[href^=#]’).click(function(){
var scroll_top = $(‘a[name=”‘ + $(this).attr(‘href’).substring(1) + ‘”]’).position().top;
scrollpane_api.scrollTo(0, scroll_top);
return false;
});

jQuery Orientation

$(window).bind(‘orientationchange’, function(event){
alert(‘Hello World’);
});

jQuery supersized: Fade In First Image

Open supersized.3.2.7.js and change the line:
base.$el.css(‘visibility’,’visible’);
to
base.$el.css(‘visibility’,’visible’).hide().fadeIn();

Detect Cut, Copy and Paste Event with JQuery

$(‘#textbox’).bind(‘cut’, function() {
alert(‘cut’);
});

$(‘#textbox’).bind(‘copy’, function() {
alert(‘copy’);
});

$(‘#textbox’).bind(‘paste’, function() {
alert(‘paste’);
});

jQuery Validate Plugin: Set Multiple Messages for Remote Rule

form.validate({
    rules: {
        username: {
         remote: {
               url: 'check_username.php',
                dataFilter: function(data) {
                    var json = JSON.parse(data);
                    if (json.result === true) {
                     return 'true';
                    }
                   return '"' + json.message + '"';
              }
           }
       }
   }
});

.delay() is not a function

Problem
.delay() is not a function

Solution
delay() is a new function added in jQuery 1.4. If you are using jQuery 1.3, you will get the above error. Solution is to use .animate() instead of .delay().

Example
Convert
$e.delay(1000).fadeOut();
Into
$e.animate({top: 0}, 1000).fadeOut();