Home/ Questions/Q 7783935
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T19:59:21+00:00

i wnt to swap image on click,bt here if m clicking from down image

  • 0

i wnt to swap image on click,bt here if m clicking from down image to up but again its not coming on down image if m clicking on that image…
m geting some error-x.attr(“src”) is undefined

 $(document).ready(function () {
     $('#sortdivlink').click(function () {

        var x = $("img[src$='../Images/Sort_down.png'][name='stCodeDSC']");

        if (x.attr("SRC") == "../Images/Sort_down.png") {
            x.attr('src', x.attr('src').replace("../Images/Sort_down.png", "../Images/sort_up.png"));
        }
        else {
             x.attr('src',  x.attr('src').replace("../Images/sort_up.png", "../Images/Sort_down.png"));
        }
    });
});
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    you could use a <div> with a css class with a background-image and dimensions, and use $(div).toggleClass(“new-image”) to use the updated background-image

    that will greatly simplify your code.

    [EDIT]

     <html>
    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <style>
    .first-image
    {
       background-image: url( 'http://www.google.com/press/zeitgeist2001/google_logo.gif' );
       width:218px;
       height:90px;
       background-position:center;
       background-repeat:no-repeat;
    }

    .second-image
    {
       background-image: url( 'http://www.google.com/doodle4google/2008/images/regional_doodles/CO-80106-16a267f8-3.jpg' );
       width:350px;
       height:224px;
       background-position:center;
       background-repeat:no-repeat;
    }
    </style>

    <script>
    $(document).ready(function( ) 
    { 
        $("#target-div").click( function( ) 
        {  
           $("#target-div").toggleClass("second-image");
        });
    });
    </script>
    </head>
    <body>
    <div id="target-div" class="first-image"></div>
    </body>
    </html>
    • 0