3 Replies Latest reply on May 13, 2007 9:06 PM by Newsgroup_User

    popup window

    JohnGree Level 1
      Hi i have a dynamic list of users with a small image next to each users name, this image is clickable which opens up a popup window with the users details in.

      is it possible to use the alt tag or javascript to make the display open quicker rather than a popup window?
        • 1. Re: popup window
          Level 7
          JohnGree wrote:
          > Hi i have a dynamic list of users with a small image next to each users name,
          > this image is clickable which opens up a popup window with the users details in.
          >
          > is it possible to use the alt tag or javascript to make the display open
          > quicker rather than a popup window?
          >

          you could put each user's details on the same page as the user list in a
          div tag with name & id set to "[something+]userid" and
          visibility="hidden" and display="none" and then add a javascript to the
          image's/link's onclick event to change the div's attributes to
          visibility="visible" and display="inline" (or "block").

          shout if you need help.

          --
          Azadi Saryev
          Sabai-dee.com
          Vientiane, Laos
          http://www.sabai-dee.com
          • 2. Re: popup window
            JohnGree Level 1
            ok yes that sounds good

            my links are

            <a href="' http://www.thesmsengine.com/UserDetails.cfm?ID=#GetUser.ClubID#">
            <img src="images/square.gif" alt="UserDetails.cfm" width="10" height="10" border="0">
            </a>

            how do i now do the div?

            many thanks

            John
            • 3. Re: popup window
              Level 7
              hi John,

              so, you have a getUser query on your page which, presumably, returns all
              user detils you want to show. you are also, presumably, outputting that
              query's result usinf a <cfoutput query="getUser"> (and iside of this
              cfoutput you have the links and images).

              i am also assuming your output is NOT table-based (hence using <div>
              tags; if it is table-based, you can add appropriate id's to
              corresponding table cells directly instead of divs):

              first, the html/cfml:
              (note the added id attribute in the <img> tag!!! [need it to dynamically
              change the alt text of image])

              <cfoutput query="getUser">
              <p><a href="##" onClick="onClickShowDetails(#getUser.clubID#);"><img
              src="images/square.gif" id="img_#getUser.ClubID#" alt="Show User
              Details" width="10" height="10" border="0"></a>[some other output here,
              i.e. user name, etc]</p>
              <div id="userdata_#getUser.clubID#" style="display:none;
              visibility:hidden;">
              [user details output goes here in whichever layout you want]
              </div>
              </cfoutput>

              javascript function - put in the <head> section of the page:
              (don't forget to change <sc_ript> tags to proper tags if you are
              copying&pasting!!!)

              <sc_ript type="text/javascript">
              function onClickShowDetails(userid){
              if(document.getElementById("userdata_"+userid).style.visibility=="hidden") {
              document.getElementById("userdata_"+userid).style.visibility="visible";
              document.getElementById("userdata_"+userid).style.display="block";
              document.getElementById("img_"+userid).alt=="Hide User Details";
              } else {
              document.getElementById("userdata_"+userid).style.visibility="hidden";
              document.getElementById("userdata_"+userid).style.display="none";
              document.getElementById("img_"+userid).alt=="Show User Details";
              }
              }
              </sc_ript>


              this should work just fine, but let me know if you are having problems.

              --

              Azadi Saryev
              Sabai-dee.com
              http://www.sabai-dee.com