PDA

Click to See Complete Forum and Search --> : DIV lookup?

tomtomlo
01-21-2008, 03:26 PM
I'm using a DIV as a sidebar, it contains a bunch of thumbnails which when clicked take the users to the page containing the full sized image.

The page with the full sized image also has this sidebar on it.

In fact every page has the sidebar. :D

The problem is, every time I add an image, I have to add it to every single page.

Is there anyway to get the DIV to look up the list of thumbnails from an external HTML document so that I only have to add a new thumbnail in one place for all of my pages to display it?

Maybe XML has the answer.

Thanks guys!!!

Tom
cbalke
01-21-2008, 03:49 PM
i'm pretty sure you could put server-side includes inside divs that could include all the content you wanted in the div

<div id="id>
<!--include file="filename.html" -->
</div>
tomtomlo
01-21-2008, 05:31 PM
I dont have SSI, I'm not hosted on a Linux server.

I have IIS though. Apperently my provider can only provide SSI if I switch to a Linux server.

anyway to do this without SSI?

an iFrame maybe?
cbalke
01-21-2008, 06:09 PM
oh man, that's no fun. i guess i may be of no help to you, then, cause i've always had SSI and that can make thing so much easier.

now that i think of it, you could definitely do an iframe. the only problem would come if you change the length of content and need to resize the iframe on each page. check that, i've actually run a script to dynamically resize iframes to accomodate content.

lemme see if i can find that script and i'll post it for you. i think there's two or three separate parts to it, but it's easy to implement....

found it:

In your page where the iframe will be contained, use the following code (add attributes more as needed):

<iframe id="dynamIframe">


Now, in ANY page that is to be loaded into the iframe insert the following code (preferably between the <head> & </head> tags)

<script>
function resizeToContent(){
var x =0;
var y =this.document.body.scrollHeight;
while (x < y){
x+=1;
}
parent.document.getElementById("dynamIframe").style.height=x
}
</script>


Finally, use the following as the body tag in the same pages as the javascript above:

<body onload="resizeToContent()">
WebJoel
01-21-2008, 07:09 PM
Probably not as elegant as the suggestion above, but this could be done using "<object>" tags, and have the data="" point to your own 'page' of course, which when updated (add images, articles, etc) just once, and EVERY page that has this "<object"> tag with different data="" works.
-It's similar in functioning as the iFRAME. A bit easier and maybe more all-browser..

Example:

In the "<body>", try:<object type="text/html" data="http://www.msnbc.com" style="width:251px; height:475px; float:left;"></object>
<object type="text/html" data="http://www.msn.com" style="width:500px; height:475px; float:left;"></object>