jQuery numbers only on textbox

For input[type="text"] number only! 

jQuery(".button").keydown(function(event) {
 if ( event.keyCode == 46 || event.keyCode == 8 || 

event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||            
  (event.keyCode == 65 && event.ctrlKey === true) ||          
  (event.keyCode >= 35 && event.keyCode <= 39)){              
    return;// let it happen, don't do anything
 }
 else {
  if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && 

(event.keyCode < 96 || event.keyCode > 105 )) {
   event.preventDefault(); 
  }   
 }
});

jQuery simple accordion

This is a tutorial on how to make a simple accordion.

jQuery

jQuery(".className ul").not(":first").hide();
jQuery(".className>li>a").hover(function(){
    var hasUl=jQuery(this).next("ul").html();
    if(hasUl!=null){
         if(!jQuery(this).next("ul").is(":visible")){
            jQuery(".className ul").slideUp("slow");
            jQuery(this).next("ul").slideDown("slow");
         }
    }
});

html
<ul class="className">
    <li>
        <a href="#">level 1</a>
        <ul>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>           
        </ul>
    </li>
    <li>
        <a href="#">level 1</a>
        <ul>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>           
        </ul>
    </li>
    <li>
        <a href="#">level 1</a>
        <ul>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>
            <li><a href="#">level 2</a></li>           
        </ul>
    </li>
</ul>

Hope it will help!!!
(i made this one)

jQuery(".ver3 ul").not(":first").hide();
jQuery(".ver3>li>a").hover(function(){
    var hasUl=jQuery(this).next("ul").html();
    if(hasUl!=null){
         if(!jQuery(this).next("ul").is(":visible")){
            jQuery(".ver3 ul").slideUp("slow");
            jQuery(this).next("ul").slideDown("slow");
         }
    }
});

jQuery(".ver3 ul").not(":first").hide();
jQuery(".ver3>li>a").hover(function(){
    var hasUl=jQuery(this).next("ul").html();
    if(hasUl!=null){
         if(!jQuery(this).next("ul").is(":visible")){
            jQuery(".ver3 ul").slideUp("slow");
            jQuery(this).next("ul").slideDown("slow");
         }
    }
});

jQuery(".ver3 ul").not(":first").hide();
jQuery(".ver3>li>a").hover(function(){
    var hasUl=jQuery(this).next("ul").html();
    if(hasUl!=null){
         if(!jQuery(this).next("ul").is(":visible")){
            jQuery(".ver3 ul").slideUp("slow");
            jQuery(this).next("ul").slideDown("slow");
         }
    }
});

jQuery falling letters plugin

 Falling letter jQuery plugin.

plug in:
(function($){
    $.fn.fallLetters = function(options){  
        // the default options
        var defaults = {  
            minFont:14, // minimum font size to be displayed(in pixel)
            maxFont:20, // maximum font size to be displayed(in pixel)
            minSpeed:2000, // should be larger than the maxspeed, 1000 = 1 sec
            maxSpeed:1000, // the smaller the amount the faster it fall, 1000 = 1 sec
            fading:true // fading while falling effect
        }          
      
        // to override the defaults of each option
        var options = $.extend(defaults, options);
        return this.each(function(){
      
            // declaration of variables
            var cont=$(this);  
            var contWidth=($(this).width())-50;
            var contHeight=($(this).height())+150;
          
            // container's CSS
            cont.css({"position":"relative","overflow":"hidden"});
          
            // wrap the letters with span
            cont.children().andSelf().contents().each(function(){
                if (this.nodeType == 3) {
                    var $this = $(this);
                    $this.replaceWith($this.text().replace(/(\w)/g, "<span>$&</span>"));
                }
            });      
          
            // onload random span left and font
            reset();  
            cont.find("span").each(function(){
                $(this).css({"left":randomLeft(),"fontSize":randomFont(),"position":"absolute"});
            });
          
            // loops every 2 mins
            setInterval(function(){
                cont.find("span").each(function(){
                    $(this).animate({"top":contHeight+"px","opacity":ifFallAndFade()},randomSpeed(),function(){
                        var Left=randomLeft();
                        $(this).css({"left":Left,"fontSize":randomFont()});
                        reset();
                    });
                });
            },100);
          
            // fading while falling
            function ifFallAndFade(){
                if(options.fading){
                    return 0;
                }
                else{
                    return 1;
                }
            }
          
            // randomize left css of each character
            function randomLeft() {
                var maxLeft= contWidth;
                var left= Math.floor(Math.random() * maxLeft + 1) + 'px';
                return left;
            }
          
            // randomize the time of each character
            function randomSpeed(){
                var speed=Math.floor(Math.random() * options.minSpeed + options.maxSpeed);
                return speed;
            }
          
            // randomized the font size of each character
            function randomFont() {
                var fontSize= Math.floor(Math.random() * options.maxFont + options.minFont) + 'px';
                return fontSize;
            }
          
            // reset or back to top, -100px so that it will be hidden
            function reset(){
                cont.find("span").css({"top":"-100px","opacity":"1"});
            }
        });  
    };
})(jQuery);

script:
<script type="text/javascript">
        jQuery(document).ready(function(){
            jQuery("#cont").fallLetters({
                minFont:10,
                maxFont:24,
                minSpeed:3000,
                maxSpeed:1500,
                fading:true
            });   
        });   
    </script>

html:
<div id="cont">ABCDEFGHIJKLMNopqrstuvwxyz1234567890</div>

Hope this will help!..
(i made this one)

simple jQuery rotator

This is a simple jQuery rotator for banners. 

jQuery:
<script type="text/javascript">   
    jQuery(function(){
        setInterval("rotate()",3000);
    });
    function rotate(){
        var a=jQuery("#con div.current");
        var b=a.next();
        if(b.length==0)
        b=jQuery("#con div:first");
        a.removeClass("current").addClass("prev");
        b.css({opacity:0.0}).addClass("current").animate({opacity:1.0},1000,
        function(){
            a.removeClass("prev");
            });
        setTimeout(function(){
        },1500);
    }
</script>

css:
<style type="text/css">
    #con img{min-width:500px;min-height:200px;width:100%;position:relative;}
    #con div{z-index:0;position:absolute;width:500px;height:200px;}
    #con div.prev{z-index:1;}
    #con div.current{z-index:2;}
</style>

html:
<div id="con">
        <div><img src="image1.jpg"></div>
        <div><img src="image2.jpg"></div>
        <div><img src="image3.jpg"></div>
        <div><img src="image4.jpg"></div>
        <div><img src="image5.jpg"></div>
    </div>

IE6 min-height css hack

    selector {
       min-height:500px;
       height:auto !important;
       height:500px;
    }

jQuery input file change layout

This jQuery plug in is used to modify the style of you input file layout.

html:
<div id="cont">
        <input type="file" class="fileUpload">  
</div>

jQuery:
<script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery(".fileUpload").fileUploadChange({
            image:'images/browseImg2.jpg'
        });
    });   
</script>

This is the jquery plug in.
(function($){
    $.fn.fileUploadChange = function(options){   
        // the default options
        var defaults = {   
            image:'images/browseImg.jpg'
        }           
        // to override the defaults of each option
        var options = $.extend(defaults, options);
        return this.each(function(){   
            // hides the input file
            var x=$(this);
            $(this).css({"position":"absolute","top":"-100px"});           
            // add the dummy input text and button image
            $(this).after("<input type='text' class='dummyInputText' readonly='readonly'><img class='dummyButton' src='"+options.image+"'>");
           
            // triggers the input file when the dummies are clicked
            $(".dummyInputText, .dummyButton").live("click",function(){
                $(".fileUpload").trigger("click");   
                $.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());                
                if($.browser.msie || $.browser.chrome){
                    getIEvalue();
                }
                else{
                    getValue();
                }
            });
           
            // this function gets the value of input file and displays in the dummy
            function getValue(){
                setInterval(function(){
                    var value=$(".fileUpload").val();       
                    $(".dummyInputText").val(value);
                },100);
            }
           
            // this function gets the value of input file and displays in the dummy IE or CHROME
            function getIEvalue(){
                setInterval(function(){
                    var value=$(".fileUpload").val();
                    value=value.replace(/[/\\*]/g, "/");
                    var xvalue=value.split("/");
                    var l=xvalue.length;
                    var ievalue=xvalue[l-1];
                    $(".dummyInputText").val(ievalue);
                },100);
            }
        });   
    };
})(jQuery);

Hope this will help!..

customizing google translate in your website

This is my way of customizing the google translate in a website. 

<style type="text/css">
/* to hide the toolbar and tooltip - START */ 
.goog-tooltip {
display: none !important;
}
.goog-tooltip:hover {
display: none !important;
}
.goog-text-highlight {
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
}
.goog-te-banner-frame{
display:none !important;
}
body{
top:0 !important;
}
.skiptranslate{
height:30px;
overflow:hidden;
}
/* to hide the toolbar and tooltip - END */ 
</style>

<!-- script for the google translate  -->

<script type="text/javascript">
    function googleTranslateElementInit() {
      new google.translate.TranslateElement({
             pageLanguage: 'en',    gaTrack: true
      }, 'google_translate_element');
    }
</script>
<script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

<!-- display the drop down of all languaes -->

<div id="google_translate_element"></div>