0

Hi I am new to javascript. I have found jquery very handy. So I used it to display a popup on a page for one link. The popup is opening fine with that link. But when I am trying to open same popup with other links then its not opening in IE 6 7 8. I used property 'this' to achieve on multiple links. I have used Below is my code:

CSS

#box {width: 100px; height:100px; background: red; position: absolute; top:0px; right:0px; display:none;}

javascript

$(function(){

$("#clickme",this).click(function(){

    $("#box").show();   

});

$("#close").click(function(){

    $("#box").hide();   

});

});

html

<a href="#" id="clickme">CLICKa MEa</a>&nbsp;&nbsp;<a href="#" id="clickme">CLICKa MEa</a>
close
  • On ie8 u can press f12 to acces developer mode.. try to see if it catch any javascript error and please post, post complete source so we can see ur poppup implementation or where is the object with id 'box' to see if there is any problem with that. Im sorry if its not an answer but i cant comment the question but want to help a bit. – Camilo Lizarazo Feb 07 '11 at 05:33

1 Answers1

1

Avoid using same ID for different elements on one page. With your html code

<a href="#" id="clickme">CLICKa MEa</a>
&nbsp;&nbsp;
<a href="#" id="clickme">CLICKa MEa</a>

jquery returns only first element in collection. Use class name instead of id and when all will work properly:

<a href="#" class="clickme">CLICKa MEa</a>
&nbsp;&nbsp;
<a href="#" class="clickme">CLICKa MEa</a>

and then

$( function() {
    $( ".clickme" ).click (function() {
        $( "#box" ).show();   
    });

    $( "#close" ).click( function() {
        $( "#box" ).hide();   
    });
});
CoolEsh
  • 3,134
  • 1
  • 21
  • 24