javascript - how to toggle the same object for different object? -


actually dont know how express problem.

you can see fiddle come know problem.

as can see in fiddle when clicking on first image pop appears when clicking on other image popup hides ..i know togggling effect to if want when click on second image first toggle should on other should start?

my code

    <div id='player-back'>     <img src='http://s6.postimg.org/su0e7812l/player1.png' data-playerid="1" id='p1'/>     <img src='http://s6.postimg.org/afpv38orx/player2.png' data-playerid="2" id='p2'/>     <img src='http://s6.postimg.org/h7ga63drh/player3.png' data-playerid="3" id='p3'/>     <div id='player-popup' style="display:none">             <span>player1</span>     </div>     </div>  $("img").click(function(){     var top = $(this).offset().top + $(this).width() + 2;     var left = $(this).offset().left - $(this).height() / 2;       $("#player-popup span").text("player "+$(this).data("playerid"));      $("#player-popup").css({ top: top, left: left }).toggle('slow');  });   #player-back{     height:250px;      background:#0f0; } #p1{     margin-top:50px;     margin-left:80px; } #p2{     margin-left:150px; } #p3{     margin-left:200px; } #player-popup{     background:orange;     height:27px;     width:85px;     border-radius:10px;     text-align:center;     position:absolute; } 

jsfiddle demo

you need hide popup before toggle in case when clicking other object after one. can store clicked object in variable like

var prevobj = null; $("img").click(function(){         var top = $(this).offset().top + $(this).width() + 2;     var left = $(this).offset().left - $(this).height() / 2;       $("#player-popup span").text("player "+$(this).data("playerid"));       if(prevobj != this)         $("#player-popup").hide();     $("#player-popup").css({ top: top, left: left }).toggle('slow');         prevobj = this; }); 

Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -