jQuery ajaxError function

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("button#call").click(function () {
            $("div#response").load("page.html");
        });
        $("div#log").ajaxError(function () {
            $(this).text("Triggered ajaxError handler.");
        });
    });
</script>
<button id="call">Call</button>
<div id="response"></div>
<div id="log"></div>

How to create an image rotator with jquery and css

Whenever you need to display random images (more than 1 image) ,
you can do it using simple jquery cycle plugin.

Here is the small explanation :-


<script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript" src="jquery.cycle.all.js"></script>
 <script type="text/javascript">
 $(document).ready(function(){
 $('#<em><strong>imagediv</strong></em>').cycle({
 fx:    'fade',
 speed:  2500
 });
 });
 </script>

<div id="<em><strong>imagediv</strong></em>">
 <img src="image1.jpg"  alt="image1" />
 <img src="image2.jpg" alt="image2" />
 <img src="image3.jpg alt="image3" />
 <img src="image4.jpg  alt="image4" />
 <img src="image5.jpg alt="image5" />
 </div>
  1. Download jquery.js from http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js
  2. Download jquery.cycle.all.js from http://malsup.github.com/jquery.cycle.all.js
  3. Include both .js files in header .
  4. add following CSS
    .pics {
    height: 117px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 354px;
    }
    

There are many options to set time for fading effect & all..

You can refer http://jquery.malsup.com/cycle for more option & customization jQuery cycle plugin.

Thats it ..

Done.. Enjoy !!!

Using Jquery – Remove Space and special characters while typing

Whenever you need to remove “space” as well as “special characters” between characters while typing, you can do it easily using jQuery as described below :-

Checkout this code in action :- http://jsfiddle.net/hn9wk/18/

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<input type="text" name="text_box_id" id="text_box_id" />
<script>
    $("#text_box_id").change(function() {
        var name = $(this).val();
        var dname_without_space = $("#text_box_id").val().replace(/ /g, "");
        var name_without_special_char = dname_without_space.replace(/[^a-zA-Z 0-9]+/g, "");
        $(this).val(name_without_special_char);
    });
</script>
</html>

Disabling Right Click (context menu) with jQuery

Whenever you need to disable “Right Click” in browse you can do it easily using little jQuery.


<script type="text/javascript">
 $(document).ready(function()
 {
 $(document).bind("contextmenu",function(e){
 return false;
 });
 });
 </script>

.after( content ) :- Insert content, specified by the parameter, after each element in the set of matched elements.

When we need to insert some html content after specified element,we can achieve it using after() method.

Example :-

<html>
<head>
<style>
p { background:yellow; }
</style>
<script src=”http://code.jquery.com/jquery-1.5.js”></script&gt;
</head>
<body>
<p>I would like to say: </p>
<script>
$(“p”).after(“<b>Hello</b>”);
</script>
</body>
</html>

Output :-

jquery after method
jquery after method