Results 1 to 5 of 5

Thread: need code to swap out pages after clicking a link or button

  1. #1
    Join Date
    Mar 2014
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default need code to swap out pages after clicking a link or button

    so I have an iframe.html and a index.html page.... the fixed iframe is across the top of the page and should act kind of as the navigation menu... I want to put 3 links in the iframe that when clicked on will change the index page to a different one..

    for example: clicking link 1 from the iframe will change the index.html to index2.html and so on.....

    is there code anywhere that I can use for that?

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    Sounds like you need to use the target attribute and possibly a named iframe. However without seeing a live mock-up, its hard to visualise what you're describing.

    The following responses should help: http://www.w3schools.com/tags/att_a_target.asp and http://www.w3schools.com/tags/att_iframe_name.asp

    If you need more help, please provide a link to your page.
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

  3. #3
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,881
    Thanks
    49
    Thanked 266 Times in 258 Posts
    Blog Entries
    56

    Default

    You should do it the other way round. Navigation menu in the main page, content pages in the iframe. Example:
    <!doctype html>
    <html >
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

    <title></title>

    <style>
    body {font-family: verdana; font-size: 12px; background: #dedede}
    </style>

    </head>

    <body >

    <div style="position: relative; text-align: center">
    <a href="javascript: void(0)" onclick="location.search='http://www.dynamicdrive.com'">DynamicDrive</a>
    <a href="javascript: void(0)" onclick="location.search='http://www.dynamicdrive.com/forums'">DynamicDriveForums</a>
    <a href="javascript: void(0)" onclick="location.search='http://edition.cnn.com'">CNN</a>
    </div>

    <iframe name="ifr" style="position:absolute; left:10%; top: 10%; width:80%; height: 80%; background: white" src="http://www.dynamicdrive.com"></iframe>

    <script>
    var data=location.search;
    if(data)
    {
    data = location.search.substring(1); // needed to remove the '?'
    ifr.location.replace(data)
    data=''
    }
    </script>

    </body>

    </html>
    This method is bookmarking friendly.

  4. The Following User Says Thank You to molendijk For This Useful Post:

    wecandoit (03-12-2014)

  5. #4
    Join Date
    Mar 2014
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    How do I remove the borders of the iframe? frameborder=0 does not work..

    also scrolling=no doesn't work either

  6. #5
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,881
    Thanks
    49
    Thanked 266 Times in 258 Posts
    Blog Entries
    56

    Default

    This will work:
    <iframe name="ifr" style="position:absolute; left:10%; top: 10%; width:80%; height: 80%; background: white" src="http://www.dynamicdrive.com" scrolling="no" frameborder="0"></iframe>

Similar Threads

  1. Resolved Clicking on a button for limited times
    By egturnkey in forum PHP
    Replies: 15
    Last Post: 07-31-2009, 03:46 PM
  2. my computer restarts on clicking shut down button
    By vineet in forum Computer hardware and software
    Replies: 5
    Last Post: 12-30-2008, 04:33 AM
  3. Replies: 4
    Last Post: 04-23-2008, 03:20 AM
  4. clicking a radio button
    By VatsaL in forum JavaScript
    Replies: 0
    Last Post: 11-20-2006, 07:40 PM
  5. Replies: 0
    Last Post: 11-14-2006, 02:37 PM

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
  •