www.webdeveloper.com
Results 1 to 7 of 7

Thread: Loading content within DIV layers

  1. #1
    Join Date
    Mar 2008
    Posts
    21

    Loading content within DIV layers

    Hi, currently I have a website Click which has content that can be switched without a page refresh. I've used a javascript for this. The problem is... this increases the loading time for the website which makes it inconvenient especially if I were to expand the site to hold much more.

    So here's my question... is there any way I can replace the div content with a seperate external html page such that when I click a tab, only the content within the div layer will be refreshed while the rest of the page (i.e. menu bar etc.) remains static?

  2. #2
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    You can do that with an IFRAME.
    However, I suggest you look into server-side includes, which allow you to insert several pieces of your webpage together through one line of code.
    Reference: http://www.georgedillon.com/web/ssi.shtml
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  3. #3
    Join Date
    Mar 2008
    Posts
    21
    I've used shtml before, but I just want the content in the div layer to refresh when a tab is clicked without the whole page refresh. At the moment, my website can do that with some javascript, but the full contents of all tabs have to be loaded when you enter the site thus making loading slow. I want to call out data from seperate html files when different tabs are clicked such that the div content changes, is that possible without iframes?

    I'm running most of the stuff using div layers, so I hope to stick to that if I can.

  4. #4
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    You don't need to load up hidden content, which I guess is what's causing your initial load problem. Do it on demand with AJAX.
    "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." Brian W. Kernighan

  5. #5
    Join Date
    Feb 2007
    Posts
    108
    Yeah that's pretty simple to do with Ajax. Here's a helpful link:
    http://www.dynamicdrive.com/dynamici...axtabscontent/

  6. #6
    Join Date
    Mar 2008
    Posts
    21
    Hey, thanks for your help guys, but I think running another javascript is gonna make everything super complex. I'm already running a javascript to switch content without a page refresh.

    Not only that. I have a sub level menu that is able to do that too. So, this means i must have ajax to work with both main level and sub level menu which I have no idea how to as it's really so complex.

    Can anyone help me? Or will server side inclue achieve the same thing?

  7. #7
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    Or will server side include achieve the same thing?
    That would require a page refresh.

    Basic AJAX isn't really all that complex plus don't think of it as ADDING to your existing script because it's going to REPLACE some of your existing script.
    "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." Brian W. Kernighan

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles