javascript - JS PopUp windows from different sources -


i need make simple js popup view specific content of each link (team stats). i've got basic html set should popup mentioned content.

   <!-- start team-players -->       <div class="team-players">         <div class="player-profile">           <img data-js="open" src="img/team-ico/team-srsne.jpg" alt="" class="thumbnail">           <span class="number">#1</span>           <span class="name">hk sršňe košice</span>         </div>                     <div class="player-profile">           <img data-js="open" src="img/team-ico/team-kvp.jpg" alt="" class="thumbnail">           <span class="number">#2</span>           <span class="name">hk kvp represent</span>         </div>         <div class="player-profile">           <img data-js="open" src="img/team-ico/team-warriors.jpg" alt="" class="thumbnail" >           <span class="number">#3</span>           <span class="name">hk spartan warriors</span>         </div> 

etc...

at end there popup opening code:

<div class="container"> <button data-js="open">open popup</button> 

<div class="popup"> <h2>$team_name (team name, selected links above should displayed)</h2> <button name="close">close popup</button> 

javascript code:

function popupopenclose(popup) {  /* add div inside popup layout if 1 doesn't exist */ if ($(".wrapper").length == 0){     $(popup).wrapinner("<div class='wrapper'></div>"); }  /* open popup */   $(popup).show().this;   /* close popup if user clicks on background */ $(popup).click(function(e) {     if ( e.target == ) {         if ($(popup).is(':visible')) {             $(popup).hide();         }     } });  /* close popup , remove errors if user clicks on cancel or close buttons */ $(popup).find("button[name=close]").on("click", function() {     if ($(".formelementerror").is(':visible')) {         $(".formelementerror").remove();     }     $(popup).hide(); }); }  $(document).ready(function () { $("[data-js=open]").on("click", function() {     popupopenclose($(".popup"));   }); }); 

could me , advise how can sort links open popup window related each link? maybe sort id or so?

appreciate

i have 2 solutions:

  1. in html create hidden popups teams id="popup-team-1", , in link add additional attribute <a data-id="1".. , in javascript this:

var id = $(this).attr("data-id"); $("#popup-team-"+id).show();

  1. load content of popup server

    $.get(url).done(function (content) {      $(".popup").html(content).show(); })  

Comments

Popular posts from this blog

python Tkinter Capturing keyboard events save as one single string -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

javascript - Z-index in d3.js -