Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Junior Member
    Join Date
    Oct 2003
    Posts
    3
    Member #
    3717
    Is it possible to implement a page-by-page navigational system inside a DIV. I have "pages" of results in a database table that I would like to display in the DIV and have change depending on the navigation that is clicked (i.e. next page, previous page). Is this possible using DIV's or would this require an IFRAME?

    Thanks,

    *

  2.  

  3. #2
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    Would require iframe if you want to load a new HTML page for each link.

    However, you could do it with DIVs just by placing each "page" in its own invisible div on the page and turning them on and off on click, like so:
    Code:
    <div id="contentArea">
        <div id="homePage" style="display:inline; scroll:auto">
            <!-- home page content -->
        </div>
        <div id="aboutPage" style="display:none; scroll:auto">
            <!-- about page content -->
        </div>
        <div id="servicesPage" style="display:none; scroll:auto">
            <!-- services page content -->
        </div>
    </div>
    Of course, then you'd need javascript to control the divs turning on and off.

    Really, you're better off using one scrolling div and server-side includes. That way you get the best of both worlds.

    Server Side Includes (SSI):

    Server Side Includes are special tags that can be used in PHP, ASP, JSP, and SHTML scripts to include the contents of one text-based (html, etc.) file into another.

    Find details on how to use them here: http://www.webdesignforums.net/showt...5519#post68869

  4. #3
    Junior Member
    Join Date
    Oct 2003
    Posts
    3
    Member #
    3717
    Does that mean I can't use a javascript function that forces the update, like "destFrame.location.href = src" - or similar?

    Ideally I'd like to have a page that takes a page_number variable to display (probably fed by a pulldown on the parent page) and loads that page (i.e. databasepull.php?page=4) into the DIV/IFRAME.

    *

  5. #4
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    You can only do that with iframes

  6. #5
    JR
    JR is offline
    Senior Member JR's Avatar
    Join Date
    Nov 2002
    Location
    UK
    Posts
    4,354
    Member #
    257
    Something like this?
    Code:
    
    <html>
    <head>
    <script type="text/javascript">
    function swapdiv(prev, next) {
    	document.getElementById(prev).style.left = "-500px"
    	document.getElementById(prev).style.top = "-500px"
    	document.getElementById(next).style.left = "5px"
    	document.getElementById(next).style.top = "5px"
    }
    </script>
    </head>
    
    <body>
    <div style="width: 300px; height: 150px; padding: 5px; position: absolute; left: 5px; top: 5px; border: 1px solid #000000;" id="div1">
    Page 1<br /><br /><a href="javascript:swapdiv('div1', 'div2')">Next</a></div>
    <div style="width: 300px; height: 150px; padding: 5px; position: absolute; left: -500px; top: -500px; border: 1px solid #000000;" id="div2">
    Page 2<br /><br /><a href="javascript:swapdiv('div2', 'div1')">Previous</a></div>
    </body>
    </html>
    
    Please remove spaces in 'JavaScript'
    JR

  7. #6
    Junior Member
    Join Date
    Oct 2003
    Posts
    3
    Member #
    3717
    It looks like I'm just going to have to load all of the pages and use javascript to page through them.

    Thanks for the help!

    *


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 06:27 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com