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 10 of 10
  1. #1
    New Coder
    Join Date
    Jun 2007
    Posts
    25
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Repeating Events

    I am making a toolbar for a website (using frames) which will have many links on it. I want to try to find someway to be able to click one of the links and have that link continuously load in the "main" frame. Any help would be appreciated as I am a relative "noob" when it comes to Javascript... Unfortunately I don't have any code that would be helpful to post but if you want me to try and explain things clearer please just say so.

  • #2
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    Isn't that done in just html with the "target" attribute of a link?
    e.g.
    Code:
    <a href="someUrl" taget="frameName">link text</a>

  • #3
    Senior Coder NancyJ's Avatar
    Join Date
    Feb 2005
    Location
    Bradford, UK
    Posts
    3,174
    Thanks
    19
    Thanked 66 Times in 65 Posts
    I'm guessing theres more too it than that since the thread title is 'repeating events' and the OP says they want to 'continuously' load the page in the frame.

    I think you want something like

    Code:
    <script language="JavaScript">
    <!--
    var timer = null;
    var link = null;
    
    function IClickedALink(url)
    {
       clearInterval(timer);
       link = url
      timer = setInterval(reloadFrame,  1000);
    }
    
    function reloadFrame()
    {
    
       window.top.frames["myFrame"].location.href = link;
    }
    
    //-->
    </script>

  • Users who have thanked NancyJ for this post:

    Stevesparty (08-24-2007)

  • #4
    New Coder
    Join Date
    Jun 2007
    Posts
    25
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Thank you this looks like what I want, the only problem is I'm having trouble implementing it. I know I should be using an "onclick" command in my links but I'm confused about how exactly to set it up right.

  • #5
    Senior Coder NancyJ's Avatar
    Join Date
    Feb 2005
    Location
    Bradford, UK
    Posts
    3,174
    Thanks
    19
    Thanked 66 Times in 65 Posts
    show us what you've got and we can correct you. Otherwise we have to guess and thats much less productive

  • #6
    New Coder
    Join Date
    Jun 2007
    Posts
    25
    Thanks
    6
    Thanked 0 Times in 0 Posts
    This is just the relevant code and the sites are just examples. When you click the links it takes you to the site but I really don't have any clue how to get javascript things to work right...

    Code:
    <body bgcolor="#003366" >
    <font size="2" color="#FF0000"><b>Links: </b></font><font color="#000000" size="2">
    
    
    	<font color="#FFFFFF" size="2">●</font><font color="#ff0000" size="2">
    	<a href="http://www.megatokyo.com" onclick="javascript:IClickedALink(mega)" target="main">Megatokyo</a>
    	<font color="#FFFFFF" size="2">●</font><font color="#ff0000" size="2">
    	<a href="http://www.gmail.com" onclick="javascript:IClickedALink(gmail)" target="main">Gmail</a>
    	
    
    
    <script language="JavaScript">
    <!--
    var timer = null;
    var link = null;
    
    function IClickedALink(mega)
    {
       clearInterval(timer);
       link = url
      timer = setInterval(reloadFrame,  1000);
    }
    
    function reloadFrame()
    {
    
       window.top.frames.main.location.href = "http://megatokyo.com";
    }
    
    //-->
    </script>
    
    
    
    <script language="JavaScript">
    <!--
    var timer = null;
    var link = null;
    
    function IClickedALink(gmail)
    {
       clearInterval(timer);
       link = url
      timer = setInterval(reloadFrame,  1000);
    }
    
    function reloadFrame()
    {
    
       window.top.frames.main.location.href = "http://www.gmail.com";
    }
    
    //-->
    </script>

  • #7
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    Now I understand what you meant by continuously load!
    You can use the code posted by NancyJ like so;
    Code:
    <html>
    <head>
    <script type="text/javascript">
    <!--
    var timer = null;
    var link = null; // global variable to hold url of page to refresh.
    function IClickedALink(url)
    {
     clearInterval(timer);
     link = url
     timer = setInterval(reloadFrame,  5000);
    }
    function reloadFrame()
    {
       window.top.frames.main.location.href = link;
    }
    //-->
    </script>
    </head>
    <body bgcolor="#003366" >
    <font size="2" color="#FF0000"><b>Links: </b></font><font color="#000000" size="2">
    
     <font color="#FFFFFF" size="2">*</font><font color="#ff0000" size="2">
     <a href="http://www.megatokyo.com" onclick="IClickedALink(this.href);" target="main">Megatokyo</a>
     <font color="#FFFFFF" size="2">*</font><font color="#ff0000" size="2">
     <a href="http://www.gmail.com" onclick="IClickedALink(this.href);" target="main">Gmail</a>
     
    </body>
    </html>
    You pass the url of the link into the function, therefore you can reuse the same function for each link.

  • #8
    New Coder
    Join Date
    Jun 2007
    Posts
    25
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Thank You!!! It works perfectly. Although... Is there a way I can add a button to make it stop?
    Last edited by Stevesparty; 07-18-2007 at 10:40 PM.

  • #9
    Regular Coder
    Join Date
    Jul 2007
    Location
    UK
    Posts
    223
    Thanks
    0
    Thanked 14 Times in 14 Posts
    Yep.
    the javascript:
    Code:
    function stopReload(){
      clearInterval(timer);
    }
    The html:
    Code:
    <input type="button" value="Cancel" onclick="stopReload()">

  • #10
    New Coder
    Join Date
    Jun 2007
    Posts
    25
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Thanks again for all the help, it works like a charm!


  •  

    Posting Permissions

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