#1
  1. Contributing User
    SEO Chat Discoverer (100 - 499 posts)

    Join Date
    Apr 2004
    Posts
    188
    Rep Power
    15

    well not HTML, javascript really ^^'


    ok those of you who know me know i have a gaming site and for every game there are usually a lot of screenshots. and presently all i am doing is just linking the thumbnail of the image to the actualy image location .e.g

    <a href="www.blah.com/images/image_1.jpg"><img src="www.blah.com/images/thumbnail_image_1.jpg"></a>

    see what i mean? but when browsing through the script of another site they had a much better way of doing it!

    basically they had a javascript function and everytime you clicked on the image it would call the javascript function to open the image in a new window...

    does anybody have any idea on how to do this?





    it was something like this but i was hoping somebody could explain it or something:


    <script type=text/javascript>
    var _w = null;
    function createNew(thispic) {
    mypic = thispic;
    _w = window.open();
    _w.document.open();
    _w.document.write('<html><head><title>Full Image Preview</title></head><body><a href="javascript:window.close();">Close Window</a><br>');
    _w.document.write('<img src = "');
    _w.document.write (mypic);
    _w.document.write ('">');

    _w.document.write('</body></html>');
    _w.document.close();
    }
    </script>
  2. #2
  3. http://tinyurl.com/cz56g
    SEO Chat Mastermind (5000+ posts)

    Join Date
    Sep 2004
    Location
    D0RDRECHT NL
    Posts
    6,063
    Rep Power
    31
    All you have to do with that is to call the script first.

    Then have your html code as above, but change the href attribute to

    href=javascript:createNew("http://www.blah.com/images/image_1.jpg")

    ...or its relative url equivalent. The script is about as basic as they get, so unless you add something real fancy* to it, I don't see why you couldn't use your old method with target=_blank added...

    --------------------
    * You could of course add more html stuff on the target page... Just slip it into the document.write lines, in the right place of course. But never put a </script> tag inside there; you have to break that into little pieces, or the javascript that's running will think it should stop

    Useful additions would be css styles (to add some colours and borders, maybe a bit of centering) and perhaps more than one image per page... But if you don't need all that, stick with your own nice and clean code
    Last edited by Wit; Jan 30th, 2005 at 04:22 PM. Reason: added...
    ...please help me w/ the real Redscowl Bluesingsky...how2 check backlinks...now postin' @ SEO Refugee ...
    <`)~ LOL now that I finally have a paypal account, I'm charging 19,- for SEO advice via PM. Seriously...
  4. #3
  5. Extremely Googled
    SEO Chat Good Citizen (1000 - 1499 posts)

    Join Date
    Dec 2004
    Posts
    1,035
    Rep Power
    501
    If you're going to pass the URL as a parameter you might not want to make it obvious where it's going. You can never really hide the destination of course (it's in the source code) but you can use
    href="#" onClick="createNew('http://www.blah.com/images/image_1.jpg')"

    Works just as well but doesn't pop up the name in the status bar.
    Last edited by Highland; Jan 31st, 2005 at 10:54 AM.
  6. #4
  7. Contributing User
    SEO Chat Discoverer (100 - 499 posts)

    Join Date
    Apr 2004
    Posts
    188
    Rep Power
    15
    thanks for all the tips guys but is is kinda hard explaining what i am looking for

    here is what i have come up with so far :


    <HTML>
    <HEAD>

    <script language="javascript">
    function popup(image)
    {
    window.open(image)
    }
    </script>


    </HEAD>
    <BODY>


    <a href="javascript:popup('http://www.nintra.com/logo.gif')">dfgdfG</a>
    </BODY>
    </HTML>
    and this does open the image in a new window which is cool but say in the new window it opens up, how would i insert some text into it? ( i really want to place an add there so it hopefully gets more shows ;-))

    thanks
    mike
  8. #5
  9. http://tinyurl.com/cz56g
    SEO Chat Mastermind (5000+ posts)

    Join Date
    Sep 2004
    Location
    D0RDRECHT NL
    Posts
    6,063
    Rep Power
    31
    You'll need at least the complete code you posted earlier, containing the window.open() bit and the several document.write() lines. That will simply generate a new HTML page in a new window, from scratch. And you can document.write (that's like printing lines of text into the CODE of that window) anything you like, including ads, texts and scripts...

    The code you posted right now is the same as entering a .jpg or .gif filename into the address bar of the (new) browser window. That will only show the bare picture...
  10. #6
  11. Contributing User
    SEO Chat Discoverer (100 - 499 posts)

    Join Date
    Apr 2004
    Posts
    188
    Rep Power
    15
    YAHOOOOOOOOOOOOO!

    <HTML>
    <HEAD>

    <script language="javascript">

    function popup(image)
    {
    var script=window.open()
    script.document.write("<html>");
    script.document.write("<head></head>");
    script.document.write("<body>hello")
    script.document.write(" <img src='")
    script.document.write(image)
    script.document.write("'>")
    script.document.write("</body>");
    script.document.write("</html>");
    }
    </script>


    </HEAD>
    <BODY>


    <a href="javascript:popup('http://www.nintra.com/logo.gif')">dfgdfG</a>
    </BODY>
    </HTML>

    o.0 why did that just go bold
    . o well and it works!!!!! yay


    thanks wit and everyone
    mike
  12. #7
  13. <- Solan Gundersen
    SEO Chat Adventurer (500 - 999 posts)

    Join Date
    Jun 2004
    Location
    C:\Norway
    Posts
    756
    Rep Power
    16
    If you wan't to take it a little bit further you can make the pop-up window automatically resize to fit the image.

    Pop-up javascript:
    Code:
        <script type="text/javascript">
        function MM_openBrWindow(theURL,winName,features) { //v2.0
          window.open(theURL,winName,features);
        }
        </script>
    The link:
    Code:
    <a href="javascript:MM_openBrWindow('/image.htm?/foldername/image.jpg','LargeImage','resizable=yes,width=100,height=100')"><img src="/foldername/image.jpg" alt="Image name"></a>
    image.htm:
    Code:
    <html> 
        <head> 
        <title>Large image</title> 
         <script type="text/javascript"> 
           var arrTemp=self.location.href.split("?"); 
           var picUrl = (arrTemp.length>0)?arrTemp[1]:"";
           var NS = (navigator.appName=="Netscape")?true:false; 
        
        	 function FitPic() { 
        	   iWidth = (NS)?window.innerWidth:document.body.clientWidth; 
        	   iHeight = (NS)?window.innerHeight:document.body.clientHeight; 
        	   iWidth = document.images[0].width - iWidth; 
        	   iHeight = document.images[0].height - iHeight; 
        	   window.resizeBy(iWidth, iHeight); 
        	   self.focus(); 
        	 }; 
         </script> 
        </head> 
        <body bgcolor="#000000" onload='FitPic();' topmargin="0"  
        marginheight="0" leftmargin="0" marginwidth="0"> 
        <script type="text/javascript">
         document.write( "<img src='" + picUrl + "' border=0>" ); 
         </script> 
        </body> 
        </html>
    Beware, the code function at SeoChat adds spaces to the code so you may have to fix it a little bit.

Similar Threads

  1. Ranking vanished, possible html problem?
    By bluecat in forum Google Optimization
    Replies: 7
    Last Post: Aug 8th, 2004, 03:16 PM
  2. Protect HTML pages or not
    By sylvester in forum SEO Help (General Chat)
    Replies: 9
    Last Post: Jun 7th, 2004, 06:10 PM
  3. Splash Pages, Cookies, & JavaScript.. Oh My!
    By TheFesta in forum Search Engine Optimization
    Replies: 1
    Last Post: Mar 22nd, 2004, 08:34 PM

IMN logo majestic logo threadwatch logo seochat tools logo