1. Post #1
    Gold Member
    vexx21322's Avatar
    December 2008
    10,576 Posts
    Horrible title, I know.

    Anyways, I know how to make a popup, but how can I make a pop of from another part of the code?

    I have this:

    
    <A HREF="" onClick="return popup(this,'Example')">NO!</A> 
    

    And I want that to popup a window with something like this in it.

    <html>
    
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>Web Templates by LINE9.com</title>
    </head>
    
    <body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginheight="0" marginwidth="0" bgcolor="#FFFFFF">
    
    
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/topbkg.gif">
      <tr>
        <td width="50%"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="142" height="66"></td>
        <td width="50%">
          <p align="right"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="327" height="66"></td>
      </tr>
    </table>
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/blackline.gif">
      <tr>
        <td width="100%"><font color="#B8C0F0" face="Arial" size="2"><b>&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link</b></font></td>
      </tr>
    </table>
    <p style="margin-left: 20"><b><font color="#B8C0F0" face="Arial" size="2">&nbsp;</font></b><font face="Arial" size="2" color="#000000">Place
    your content here.</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp; </font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20" align="center"><font face="Arial" color="#000000" size="1">
    </font></p>
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="http://www.letting-angels.co.uk/Property_Images/test.jpg">
      <tr>
        <td width="100%"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="41" height="12"></td>
      </tr>
    </table>
    
    
    </body>
    
    </html>
    
    

    Without having the client download a file or retrieve one from a server.

  2. Post #2
    Gold Member
    Crhem van der B's Avatar
    January 2010
    1,691 Posts
    Well, not sure it's possible with what you want.
    Personally, I'm using Fancybox: http://fancybox.net/
    Would do exactly what you want.

  3. Post #3
    Gold Member
    compwhizii's Avatar
    February 2007
    8,442 Posts
    Well, not sure it's possible with what you want.
    Personally, I'm using Fancybox: http://fancybox.net/
    Would do exactly what you want.
    No it wouldn't.

  4. Post #4
    Gold Member
    Crhem van der B's Avatar
    January 2010
    1,691 Posts
    Why not? Unless I don't understand what he wants, this can do exactly what he wants. There is an example with a login form in their site. It can be used for different purposes also, obviously.

  5. Post #5
    Gold Member
    compwhizii's Avatar
    February 2007
    8,442 Posts
    Why not? Unless I don't understand what he wants, this can do exactly what he wants. There is an example with a login form in their site. It can be used for different purposes also, obviously.
    No you don't understand.

  6. Post #6
    Gold Member
    Crhem van der B's Avatar
    January 2010
    1,691 Posts
    http://cremboville.co.cc/examples/example.html

    Took unexpectedly long, but whatever.

  7. Post #7
    I spent $10 on this.
    :awesome:'s Avatar
    April 2009
    5,468 Posts
    -snip rate me bad reading-
    Reply With Quote Edit / Delete Reply United States Show Events Bad Reading Bad Reading x 2 (list)

  8. Post #8
    Gold Member
    compwhizii's Avatar
    February 2007
    8,442 Posts
    Yeah good going that's not what he wants jesus christ.

  9. Post #9
    Gold Member
    jmazouri's Avatar
    May 2005
    1,469 Posts
    Yeah good going that's not what he wants jesus christ.
    If you know what he wants, why don't you show him?

  10. Post #10
    Gold Member
    compwhizii's Avatar
    February 2007
    8,442 Posts
    If you know what he wants, why don't you show him?
    I don't have much time. He wants a small pop up.

  11. Post #11
    Gold Member
    andersonmat's Avatar
    May 2008
    2,607 Posts
    I don't have much time. He wants a small pop up.
    "I don't have time to show you how but I'm going to post here to tell you how wrong you are."

  12. Post #12
    Gold Member
    compwhizii's Avatar
    February 2007
    8,442 Posts
    "I don't have time to show you how but I'm going to post here to tell you how wrong you are."
    yeah it's my job

  13. Post #13
    Gold Member
    vexx21322's Avatar
    December 2008
    10,576 Posts
    Actually, this might just work.
    The reason I said that I they cant download from a server is, I don't have a website, but using a temp website like this might for the time being.

    Yes, this is exactly what I wanted, thanks.

  14. Post #14
    Gold Member
    Torekk's Avatar
    November 2006
    2,777 Posts
    Why not simply go for a div and then change the display type of it via that <a>?

    Like
    Code:
    <script type="text/javascript">
    function toggle(obj) {
    	var el = document.getElementById(obj);
    	el.style.display = (el.style.display != 'none' ? 'none' : '' );
    }
    </script>
    <a href="#" onClick="toggle(popup)">Show Popup</a>
    Edit: That's basically all what fancybox does, except it adds effects like fade in/out. Seriously, who needs that fancy shit?

  15. Post #15
    Gold Member
    vexx21322's Avatar
    December 2008
    10,576 Posts
    Why not simply go for a div and then change the display type of it via that <a>?

    Like
    Code:
    <script type="text/javascript">
    function toggle(obj) {
    	var el = document.getElementById(obj);
    	el.style.display = (el.style.display != 'none' ? 'none' : '' );
    }
    </script>
    <a href="#" onClick="toggle(popup)">Show Popup</a>
    Edit: That's basically all what fancybox does, except it adds effects like fade in/out. Seriously, who needs that fancy shit?
    I'm still learning, so I know just a fraction of what all that means.

  16. Post #16
    Gold Member
    Crhem van der B's Avatar
    January 2010
    1,691 Posts
    Why not simply go for a div and then change the display type of it via that <a>?

    Like
    Code:
    <script type="text/javascript">
    function toggle(obj) {
    	var el = document.getElementById(obj);
    	el.style.display = (el.style.display != 'none' ? 'none' : '' );
    }
    </script>
    <a href="#" onClick="toggle(popup)">Show Popup</a>
    Edit: That's basically all what fancybox does, except it adds effects like fade in/out. Seriously, who needs that fancy shit?
    I don't speak JavaScript (yeah, I know that's incorrect to say that) so I just use what's available (also, I actually use it for it's first purpose - viewing pictures).

    Also, compwhizii - fucking owned!@#!@#@!#$
    Reply With Quote Edit / Delete Reply United States Show Events Agree Agree x 2 (list)

  17. Post #17
    Gold Member
    Torekk's Avatar
    November 2006
    2,777 Posts
    I don't know JavaScript either, but it isn't that much different from PHP or, which both are based of, C.

    I can help you out if you want, you can find my MSN on my profile.

  18. Post #18
    Gold Member
    compwhizii's Avatar
    February 2007
    8,442 Posts
    Also, compwhizii - fucking owned!@#!@#@!#$
    LMAO YEAH YOU GOT ME GOOD LOLoloololol ePIC WINS!
    Reply With Quote Edit / Delete Reply United States Show Events Funny Funny x 1 (list)

  19. Post #19
    Erp
    Erp's Avatar
    October 2009
    4,585 Posts
    dont be mean to compwhizii :(
    Reply With Quote Edit / Delete Reply United States Show Events Agree Agree x 1 (list)

  20. Post #20
    cas97's Avatar
    August 2009
    987 Posts
    :iceburn:

  21. Post #21
    turb_'s Avatar
    February 2010
    2,202 Posts
    I don't know JavaScript either, but it isn't that much different from PHP or, which both are based of, C.
    They all have curly braces, and that's about where the similarity with C ends.

    Edited:

    Also, compwhizii, you're generally a cool guy but you're being a massive prick at the moment. It's not nice to see.
    Reply With Quote Edit / Delete Reply United Kingdom Show Events Agree Agree x 1 (list)

  22. Post #22
    Gold Member
    SataniX's Avatar
    May 2010
    5,635 Posts
    If you want it to open in an external window you could try:
    Code:
    <A HREF="" onClick="popup()">NO!</A>
    and have the second one saved as another file.
    Then, put
    Code:
    <script>
    function popup(){window.open('popup.html');}</script>

    OR:
    If you don't want it as an external window/file, you could use:
    Code:
    <div id="popup" style="display: block;display: none;position: absolute;margin: auto;">
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/topbkg.gif">
      <tr>
        <td width="50%"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="142" height="66"></td>
        <td width="50%">
          <p align="right"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="327" height="66"></td>
      </tr>
    </table>
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/blackline.gif">
      <tr>
        <td width="100%"><font color="#B8C0F0" face="Arial" size="2"><b>&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link</b></font></td>
      </tr>
    </table>
    <p style="margin-left: 20"><b><font color="#B8C0F0" face="Arial" size="2">&nbsp;</font></b><font face="Arial" size="2" color="#000000">Place
    your content here.</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp; </font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20" align="center"><font face="Arial" color="#000000" size="1">
    </font></p>
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="http://www.letting-angels.co.uk/Property_Images/test.jpg">
      <tr>
        <td width="100%"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="41" height="12"></td>
      </tr>
    </table></div>
    and in the head (Sorry, you'll need the jQuery JS library for this)
    Code:
    function popup(){
    $('#popup').fadeIn('slow');
    }
    Reply With Quote Edit / Delete Reply United Kingdom Show Events Dumb Dumb x 1 (list)

  23. Post #23
    If you want it to open in an external window you could try:
    Code:
    <A HREF="" onClick="popup()">NO!</A>
    and have the second one saved as another file.
    Then, put
    Code:
    <script>
    function popup(){window.open('popup.html');}</script>

    OR:
    If you don't want it as an external window/file, you could use:
    Code:
    <div id="popup" style="display: block;display: none;position: absolute;margin: auto;">
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/topbkg.gif">
      <tr>
        <td width="50%"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="142" height="66"></td>
        <td width="50%">
          <p align="right"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="327" height="66"></td>
      </tr>
    </table>
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="img/blackline.gif">
      <tr>
        <td width="100%"><font color="#B8C0F0" face="Arial" size="2"><b>&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link&nbsp;&nbsp; |&nbsp;&nbsp;link&nbsp;&nbsp; |&nbsp;&nbsp;
          link</b></font></td>
      </tr>
    </table>
    <p style="margin-left: 20"><b><font color="#B8C0F0" face="Arial" size="2">&nbsp;</font></b><font face="Arial" size="2" color="#000000">Place
    your content here.</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp; </font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>
    <p style="margin-left: 20" align="center"><font face="Arial" color="#000000" size="1">
    </font></p>
    <table border="0" width="100%" cellspacing="0" cellpadding="0" background="http://www.letting-angels.co.uk/Property_Images/test.jpg">
      <tr>
        <td width="100%"><img border="0" src="http://www.letting-angels.co.uk/Property_Images/test.jpg" width="41" height="12"></td>
      </tr>
    </table></div>
    and in the head (Sorry, you'll need the jQuery JS library for this)
    Code:
    function popup(){
    $('#popup').fadeIn('slow');
    }
    &nbsp; and inline styles, go awaaaaayyyy

  24. Post #24
    turb_'s Avatar
    February 2010
    2,202 Posts
    Hahahah, oh my god. I haven't seen shit like that since 2004

  25. Post #25
    Two different posts in 24 hours with that stuff, it makes me gag.

  26. Post #26
    :^)
    Wipmuck's Avatar
    May 2009
    1,767 Posts
    Why do people FUCKING insist of this shit, do they not realise we are in 2010, with HTML5 and CSS3?

    What the fuck is this shit?
    <p style="margin-left: 20"><font face="Arial" size="2" color="#000000">&nbsp;</font></p>