SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    thumbnail link to main frame? I need help!

    I’m having a problem. I hope someone can help.

    I have a site with 2 frames. The navigation frame is on the right side and the larger main frame is on the left. The navigation frame is nothing but a bunch of thumbnails that scroll when the mouse hovers over “up/down”. The links are the thumbnails. I hope you get the picture… a user would click on a thumbnail and go to a site. The problem is that I want the thumbnail to link to a site and open it in the frame on the left (the main frame.) The only options I have (through Dreamweaver) is _blank, _parent, _self, _top.

    The script I think that might need to change is below. Can anyone help me and figure out what needs to be changed?

    --------------------------------------------

    <script language="JavaScript1.2">

    //Scrollable content III- By http://www.dynamicdrive.com

    var speed, currentpos=curpos1=0,alt=1,curpos2=-1

    function initialize(){
    if (window.parent.scrollspeed!=0){
    speed=window.parent.scrollspeed
    scrollwindow()
    }
    }

    function scrollwindow(){
    temp=(document.all)? document.body.scrollTop : window.pageYOffset
    alt=(alt==0)? 1 : 0
    if (alt==0)
    curpos1=temp
    else
    curpos2=temp

    window.scrollBy(0,speed)
    }

    setInterval("initialize()",10)

    </script>


    -------------------------------------------
    Thanks for your help.

  2. #2
    ♪♪ ♪ ♪ ♪ ♪♪ ♪ ♪♪ Markdidj's Avatar
    Join Date
    Sep 2002
    Location
    Bournemouth, South UK
    Posts
    1,551
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    I think you have to use parent.(frameName)

    I have a site with three frames, and I use
    function chngMenu(nextMenu){parent.menu.location=nextMenu}
    function chngPage(nextPage){parent.page.location=nextPage}
    function chngBanner(nextBanner){parent.banner.location=nextBanner}

    hope this helps
    LiveScript: Putting the "Live" Back into JavaScript
    if live output_as_javascript else output_as_html end if

  3. #3
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's a more flexible (and compatible) function...

    function changeFrame(fName, nUrl) {
    top.frames[fName].location.href=nUrl;
    }

    However...it sounds like you are just using standard anchor tags for you linking. I can see that you are trying to properly use the target to point the links at the frame name. If you know the frame's name, you can manually type it into the target box in Dremweaver. OR, if you open up the acutal frameset in Dreamweaver and THEN edit the page in the left frame...all the frames in the frameset will become options the the target drop-down....
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  4. #4
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't really think that would help me. When a thumbnail is clicked, I need it to open a new site in the main frame or allow the navigation not to reload.
    Is there a change to the code that I can use to specify the main window?

    As of right now, I have everything working fine, except when the new page loads, it loads the navigation bar again. I don't want it to do this. I do not want it to do this because it goes to the top of my thumbnails and starts again. I want the navigation bar to remain in the same place when the new page is loaded so that the user doesn't have to scroll back down to find where they were before.

    I know very little about javascript. My complete script is below, not including many more image source files. Thanks for you help!

    ------------------------------------------------------
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->

    <script language="JavaScript1.2">

    //Scrollable content III- By http://www.dynamicdrive.com

    var speed, currentpos=curpos1=0,alt=1,curpos2=-1

    function initialize(){
    if (window.parent.scrollspeed!=0){
    speed=window.parent.scrollspeed
    scrollwindow()
    }
    }

    function scrollwindow(){
    temp=(document.all)? document.body.scrollTop : window.pageYOffset
    alt=(alt==0)? 1 : 0
    if (alt==0)
    curpos1=temp
    else
    curpos2=temp

    window.scrollBy(0,speed)
    }

    setInterval("initialize()",10)

    </script>
    </head>

    <body>
    <p><a href="DSC01566.htm" target="_top"><img src="../Photos/Philip%27s%20Photos/Thumbnails/DSC01566_t.jpg"width="80" height="60" border="0"></a></p>
    <p><a href="DSC01567.htm" target="_top"><img src="../Photos/Philip%27s%20Photos/Thumbnails/DSC01567_t.jpg"width="80" height="60" border="0"></a></p>
    <p><a href="DSC01569.htm" target="_top"><img src="../Photos/Philip%27s%20Photos/Thumbnails/DSC01569_t.jpg"width="80" height="60" border="0"></a></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20001.jpg"width="80" height="60" border="0"></p>

    </body>
    </html>

  5. #5
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Beetle,
    I am linking each thumbnail image to a site that I wish to open.
    I think that one of the problems is that my page that has the images is not in the original navigation frame. There is actually a site that links to the images. This is because the navigation frame controls the speed of the scrolling of the 2ndary site, which contains the images. Because of this, I cannot tell the target of the images to open up in the left (main) frame because it doesn't know that it is on a page with other frames. I bet that I really confused you now.

  6. #6
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ya, a bit. Got a link?
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  7. #7
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    no, I don't have a link.

    Let me try to explain this again:

    1 frameset has 2 frames.
    left frame = Main Frame.
    right frame = Scroll Frame (because it scrolls through pictures)

    The scroll frame has the code for a box which scrolls up and down when someone puts their mouse over "up" and "down"
    The script for this box is below (Scroll Box Frame)

    Inside of this box, there is different site that has the thumbnails. The script for this site I believe is in my previous reply. The box is saved as 1 htm file. The contents of the box is saved as a 2nd htm file.

    Because the thumbnails are in this 2nd htm file, they do not know about the Main Frame, therefore, I cannot link them together.

    I need to figure out a way to either 1) Put the thumbnails in that 1st Scroll Box htm file or 2)change the code for the 2nd htm file to open up in the main frame.

    THE MAIN PROBLEM-->The problem is that when I click on a thumbnail, I have to reload the whole page, 1st & 2nd frames. When I reload this 2nd frame, the thumbnails start from the beginning again, which loses my place and I have to scroll back down to find it again. This is what I need to change. I figure the best way to change this is to reload only the mainframe, which is why I am here. If you have another suggestion please help me. I do not know javascript. My knowledge is very new and spotty.

    Here's the code for the Scroll Box Frame (just save this as 1 htm file and change the source to the 2nd htm file with the images)--------
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </head>

    <body>
    <!--Scrollable iframe script- By Dynamic Drive-->
    <!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
    <!--This credit MUST stay intact for use-->
    <iframe id="datamain" src="Locks_Geology_BBQ_2.htm" width=80 height=98% marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=1 scrolling=no></iframe>
    <layer visibility=hide>
    <div style="width:100px;" align="left">
    <a href="#" onMouseover="scrollspeed=-3" onMouseout="scrollspeed=0">Up</a> | <a href="#" onMouseover="scrollspeed=4" onMouseout="scrollspeed=0">Down</a>
    </div>
    </layer>

    </body>
    </html>
    ---------------------------------------------------------
    Here's the code for the 2nd htm file with the images.
    ---------------------------------------------------------

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    <!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->

    <script language="JavaScript1.2">

    //Scrollable content III- By http://www.dynamicdrive.com

    var speed, currentpos=curpos1=0,alt=1,curpos2=-1

    function initialize(){
    if (window.parent.scrollspeed!=0){
    speed=window.parent.scrollspeed
    scrollwindow()
    }
    }

    function scrollwindow(){
    temp=(document.all)? document.body.scrollTop : window.pageYOffset
    alt=(alt==0)? 1 : 0
    if (alt==0)
    curpos1=temp
    else
    curpos2=temp

    window.scrollBy(0,speed)
    }

    setInterval("initialize()",10)

    </script>
    </head>

    <body>
    <p><a href="DSC01566.htm" target="_top"><img src="../Photos/Philip%27s%20Photos/Thumbnails/DSC01566_t.jpg"width="80" height="60" border="0"></a></p>
    <p><a href="DSC01567.htm" target="_top"><img src="../Photos/Philip%27s%20Photos/Thumbnails/DSC01567_t.jpg"width="80" height="60" border="0"></a></p>
    <p><a href="DSC01569.htm" ><img src="../Photos/Philip%27s%20Photos/Thumbnails/DSC01569_t.jpg"width="80" height="60" border="0"></a></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20001.jpg"width="80" height="60" border="0"></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20003.jpg"width="80" height="60"></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20004.jpg"width="80" height="60"></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20005.jpg"width="60" height="80"></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20006.jpg"width="80" height="60"></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20007.jpg"width="60" height="80"></p>
    <p><img src="../Photos/Keri%27s%20Photos/fall%20break,big%20bend/thumbnails/fall%20break,big%20bend%20008.jpg"width="80" height="60"></p>

    </body>
    </html>


    ------------------------------------------------
    Thanks again for helping. Sorry I am so unknowledgable in scripts.

    Philip

  8. #8
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OKAY, Nevermind, I got it. I was able to figure out a way.
    Thanks for your help, though


Bookmarks

Posting Permissions

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