Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7

Thread: Thumbnails

  1. #1
    New to the CF scene
    Join Date
    Jul 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbnails

    ok so here's what i want to do. hope you can help... i don't know much about jscript so this may be easy or impossible. either way, if you don't want to post the basic stuff, i can figure that out myself. but if you see something that sounds difficult please tell me how.

    i have thumbnails on my site. when someone clicks them, i want a window to pop up. i want the window to basically have no scrollbars, no toolbar, etc. i just want the actually pictures, which will vary in size, to show up in the windows. but i want there to be like half a centimeter of white space around the picture on all sides. to clearly define it and everything. and then an 'X' in the top right to close it.... don't know if that will work or if it is too much to ask but hope you understand. thanks for any help...

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I use the following that I got from another major forum poster (spookster maybe?) over at the old WA forum. You can play around with it to get the desired padding around your images. I've never messed with the padding personally.

    Above your </head>, put:

    <script language="javascript">
    <!-- Begin
    function imageView(imgFile,imgTitle,imgWidth,imgHeight,winPosX,winPosY){
    preview = window.open("", "","resizable=yes,toolbar=no,scrollbars=no,menubar=no,status=no,directories=no,width="+imgWidth+",he ight="+imgHeight+",left="+winPosX+",top="+winPosY+"");
    preview.document.write('<html><head><title>'+imgTitle+' - Click to close - <\/title><\/head>'+'<body onBlur="self.focus();" marginWidth="0" marginHeight="0" topmargin="0" leftmargin="0">'+'<center>'+'<a href="javascript:self.close()">'+'<img border="0" alt="Image may take a moment to load. Click the image to close the window." src="'+imgFile+'" width="'+imgWidth+'" height="'+imgHeight+'">'+'<\/a><\/center>'+'<\/body><\/html>');
    preview.document.close();
    }
    // End -->
    </script>

    Some configuration notes (color coded here):

    <!--// Parameter list as follows:
    Image File
    Title of Image
    Width of Image
    Height of Image
    Extra padding space to allow for text
    Window Position X coordinate
    [color=royal blue]Window Position Y coordinate[/color]
    //-->

    Where you have a thumbnail, use the following (change accordingly):

    <a href="javascript:imageView('large-pic.jpg','Place New Window Title Here',600,300,0,0,[color=royal blue]0[/color])"><img border="1" src="thumbnail-pic.jpg" alt="Click for larger image" width="100" height="50"></a>
    Last edited by Gordo; 07-04-2002 at 10:38 AM.
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #3
    New to the CF scene
    Join Date
    Jul 2002
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Lightbulb another option for ya

    This can also be done with layers. Set your layers to hide as default and each individual one to appear upon mouse click. Make a simple graphic for the 'close window' function (or you can use text) and then set that graphic to hide the layer upon mouse click. It's pretty easy to do in Dreamweaver.

    Hope this helps you - good luck!!

    'ding'

  • #4
    New to the CF scene
    Join Date
    Jul 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    wow thanks a lot for all the help... i'll give that a try

  • #5
    New to the CF scene
    Join Date
    Jul 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    hmm i'm having trouble now actually. i'd rather not do layers, so i was trying the javascript method posted above. i can't seem to get anything to load besides a dead page though. and i'm not sure if i'm calling the script correctly... like in the href tag. hope someone can help...

    k i think i got it now... i think it just may have been a spacing problem... supposed to be javascript: function instead of java script:function... i think.
    Last edited by everja13; 07-05-2002 at 07:20 AM.

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Location
    TEXAS . . . 'nuf said
    Posts
    468
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You are correct in that it should be one word. I pasted the code direct from my working web page, but these forums (vB Code) change a special word (like javascript) here and there. And I don't know which ones, nor how to correct it. It's some sort of Moderator secret or something...because I haven't seen any *special instruction* page, etc.

    Nice catch though...on seeing the added space.
    Gordo
    "In the End, we will remember not the words of our enemies, but the silence of our friends."
    - Martin Luther King Jr. (1929-1968)

  • #7
    New to the CF scene
    Join Date
    Jul 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    one more thing on this script... what i first wanted was to eliminate the window border and titlebar. however, when trying to do this, i've come across the term 'signed script.' i was wondering how to go about making a script 'signed' since a few javascript features require this.

    thanks...


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •