Thumbnail Viewer2 + Netscape 7.2 (mac) Prob.

**Al Fresco** · 05-05-2007, 12:22 PM

Hi. I'm hoping someone can help with a problem I have with DD Thumbnail Viewer 2. My test page works a treat in Safari, Opera, + Firefox but Netscape does not put the thumbnails into the "Footer". For some reason they are going into the "loadarea". Ive tried all sorts but just cant seem to get my head around it.

The code is:

</head>
<body>
<div id="maincontainer">

<div id="topsection"><div class="innertube"> <img border="0" src="images/name.gif" alt=""/></div></div>

<div id="contentwrapper">
<div id="loadarea">
<div class="innertube"> <b> <em></em></b></div>
</div>
</div>
<div id="leftcolumn">
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li id="active"><a href="page5.html">5</a></li>
</ul>

<div class="innertube"><b> <em></em></b></div>
</div>

<div id="footer">
<a href="images/V9Q6610.jpg" rel="enlargeimage::mouseover" rev="loadarea" > <img src="thumbnails/V9Q6610.jpg" alt="" border="0" width="25" height="25" style="margin-bottom: 5px"/></a>

<a href="images/V9Q9809.jpg" rel="enlargeimage::mouseover" rev="loadarea"> <img src="thumbnails/V9Q9809.jpg" alt="" border="0" width="25" height="25" style="margin-bottom: 5px"/></a>
<br></br>

</div>

</div>
</body>
</html>

I would greatly appreciate any help as my hair is greying fast!

Thanks.

**jscheuer1** · 05-05-2007, 01:40 PM

Your question isn't completely clear, but I will take it at face value. The layout that you show places the thumbnails in the footer and targets the larger images to the loadarea.

Now, unless NS 7.2 is significantly different on the PC, this is exactly what is happening in that browser and in FF and Opera here.

However, you haven't shown us your style or anything from the head section. This could change matters quite a bit. In fact, the best thing would be for you to supply a link to your problem page.

**Al Fresco** · 05-05-2007, 02:28 PM

Hi John,
Thanks for getting back so soon.
Below is the .css.
and the page is http://www.craigknowles.com.au/2001/page5.html

The problem is exactly as you figured. The thumbs load in the "loadarea" in Netscape (mac)!

Thanks Heaps,
craig

body{
float: centre;
margin:10;
padding:0;
line-height: 1.5em;
background: #212121;
}

b{font-size: 110%;}
em{color: red;}

#maincontainer{
width: 880px; /*Width of main container*/
height:650px; /*Height of main container*/
margin: 0 auto; /*Center container on page*/
border:1px solid #333333;}

#topsection{
background: #212121;
height: 140px; /*Height of top section*/
}

#topsection h1{
margin: 0;
padding-top: 15px;
}

#contentwrapper{
float: left;
width: 100%;
}

#loadarea{
margin-left: 250px; /*Set left margin to LeftColumnWidth*/
margin: 980;
padding: 600;
}

#leftcolumn{
float: left;
width: 250px; /*Width of left column*/
height:440px; /*Height of left column*/
margin-left: -840px; /*Set left margin to -(MainContainerWidth)*/
background: #212121;
}

#leftcolumn ul {
list-style-type: none;
margin: 0;
padding: 0;
list-style-type: none;
}

#leftcolumn li { margin: 0 0 2em 0; }

#leftcolumn a {
display: block;
display: block;
color: #999999;
background-color: #212121;
width: .5em;
padding: .2em .8em;
text-decoration: none
}

#leftcolumn a:hover
{
background-color: #212121;
color: #FFF;
border-top: 1px solid #333;
border-left: 1px solid #333;
border-right: 1px solid #333;
border-bottom: 1px solid #333;
}

#active a {
display: block;
display: block;
color: #999999;
background-color: #212121;
padding: .2em .8em;
border-top: 1px solid #333;
border-left: 1px solid #333;
border-right: 1px solid #333;
border-bottom: 1px solid #333;
}

#footer{
clear: left;
width: 100%;

color: #212121;
text-align: center;
padding: 4px 0;
}

#footer a{
color: #212121;
}

.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}

**jscheuer1** · 05-05-2007, 03:29 PM

Your css had some invalid entries, but that was not the problem. I've removed the invalid stuff since it wasn't being used anyway. The problem appears to be a bug in the NS 7.2 rendering engine. It seems to be ignoring the clear:left; style for the footer. There is a workaround for your particular layout that doesn't seem to adversely affect other browsers (see the two red entries under the loadarea selector):

Code:

body {
padding:0;
line-height: 1.5em;
background: #212121;
}

b{font-size: 110%;}
em{color: red;}

#maincontainer{
width: 880px; /*Width of main container*/
height:650px; /*Height of main container*/
margin: 0 auto; /*Center container on page*/
border:1px solid #333333;}

#topsection{
background: #212121;
height: 140px; /*Height of top section*/
}

#topsection h1{
margin: 0;
padding-top: 15px;
}

#contentwrapper{
float: left;
width: 100%;
}

#loadarea{
margin-left: 250px; /*Set left margin to LeftColumnWidth*/
height:437px;
border:1px solid #212121;
}

#leftcolumn{
float: left;
width: 250px; /*Width of left column*/
height:440px; /*Height of left column*/
margin-left: -840px; /*Set left margin to -(MainContainerWidth)*/
background: #212121;
}

#leftcolumn ul {
 list-style-type: none;
margin: 0;
padding: 0;
list-style-type: none;
}

#leftcolumn li { margin: 0 0 2em 0; }

#leftcolumn a { 
display: block;
display: block;
color: #999999;
background-color: #212121;
width: .5em;
padding: .2em .8em;
text-decoration: none
}

#leftcolumn a:hover
{
background-color: #212121;
color: #FFF;
border-top: 1px solid #333;
border-left: 1px solid #333;
border-right: 1px solid #333;
border-bottom: 1px solid #333;
}


#active a { 
display: block;
display: block;
color: #999999;
background-color: #212121;
padding: .2em .8em;
border-top: 1px solid #333;
border-left: 1px solid #333;
border-right: 1px solid #333;
border-bottom: 1px solid #333;
}


#footer{
clear: left;
width: 100%;

color: #212121;
text-align: center;
padding: 4px 0;
}

#footer a{
color: #212121;
}

.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}

By the way, this:

Code:

<script language="JavaScript" type="text/javascript">
<!--
function center(){
	window.focus();
	BrowserName=navigator.appName;
	BrowserVersion=parseInt(navigator.appVersion);

	if(BrowserName=="Netscape"){
		self.moveTo(0,0)
		self.resizeTo((screen.availWidth-8),(screen.availHeight-25))
	}else{
		self.moveTo(0,0)
		self.resizeTo((screen.availWidth),(screen.availHeight))
	}	
}

center();
// -->
</script>

Isn't all that useful. It is unnecessary for a normal sized viewport and will do odd things on very large or very small screens, will annoy many users, and is easily disabled by many browsers anyway. I'd just get rid of it

This:

Code:

<script type="text/javascript">
{
</script>

Throws an error in any javascript enabled browser and is probably just left over from a previous edit, get rid of it.

This, is also wrong:

Code:

<br></br>

Get rid of the red one

**Al Fresco** · 05-05-2007, 04:26 PM

Genius.

Thanks a million. That works perfect and I do see your point
about the resize thing.

I have however now noticed that the whole thing does not work in IE. 5.2 mac! The thumbs send you off to a new page and the main page won't
open at all. Any ideas?

Craig.

**jscheuer1** · 05-05-2007, 04:41 PM

Originally Posted by Al Fresco

I have however now noticed that the whole thing does not work in IE. 5.2 mac! The thumbs send you off to a new page and the main page won't
open at all.

Will that browser never die? It has been ages since it even shipped hasn't it? I'm not sure about that. I know for a fact it has been ages since it has been supported by either Apple or MS.

I don't have a Mac so I cannot test IE 5.2 Mac. And, I am not clear what you mean. If the main page doesn't open how would you know if the script worked or not? Anyways, unless the demo of this script on Dynamic Drive works in IE 5.2 Mac there is little hope that your installation of it can be made to do so.

IE 5.2 Mac, although way ahead of its time when first developed, has many rendering and script parsing flaws compared to today's modern browsers.

If you are committed to supporting it and it isn't primarily your layout that is causing problems, there is an older version of the thumbnail II script that might work for it.

One thing though, IE 5.2 Mac didn't (as far as I know) support filter transformations but may try to, causing errors with any version of this script which does use the filter transformation for a swipe/fade in effect of the larger images in IE 5.5+.

Thread: Thumbnail Viewer2 + Netscape 7.2 (mac) Prob.

Thread Tools

Search Thread

Thumbnail Viewer2 + Netscape 7.2 (mac) Prob.

Bookmarks

Bookmarks

Posting Permissions