Problem in Opera but not in IE and FF

Per W. · Sep 5, 2005

Hi, i am trying to help someone with some code for a simple photoalbum, its
okey in IE and in FF, but in Opera the selected picture is not showing, in
both IE and FF the picture is showing in fullsize when hover over the
thumnails, but in Opera the picture is behind the background picture, i have
tried som z-index, but then FF is going bananas.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>

<style type="text/css">
a.slidea {background:url(pic/thumb1.jpg);}
a.slideb {background:url(pic/thumb2.jpg);}
a.slidec {background:url(pic/thumb3.jpg);}
a.slided {background:url(pic/thumb4.jpg);}

..info {position:absolute; top:0; left:0; padding-bottom:1em;}

..slidek {display:block; position:relative; width:415px; height:300px;
top:0px; left:0; padding:0; border:1px solid #000000;}

a.gallery {display:block; color:#111111; text-decoration:none; border:1px
solid #ffffff; width:75px; height:54px; margin:3px; float:left;}
a.gallery span {display:block;left:0px; top:0px; width:1px; height:1px;
overflow:hidden;}
a.gallery:hover {white-space:normal; border:1px solid #000000;}
a.gallery:hover img {border:0px solid #000000;}
a.gallery:hover span {display:inherit; position:absolute; width:402px;
height:288px; top:5px; left:2px; padding:5px;}

#scrollbox {width:415px; height:80px; background:#f4f4f4; overflow:auto;
border:1px solid #aaaaaa;}
#thumbs {width:1000px; height:60px;}

</style>
<body>
<div class="info">
<div class="slidek">
<img src="bilder.jpg" alt="Camera" title="Camera" width="415" height="300"
/>
</div>
<div id="scrollbox">
<div id="thumbs">
<a class="gallery slidea" href="#nogo"><span><img src="pic/fullsize1.jpg"
width="402" height="288"/><br />
<br /></span></a>
<a class="gallery slideb" href="#nogo"><span><img src="pic/fullsize2.jpg"
width="402" height="288"/><br />
<br /></span></a>
<a class="gallery slidec" href="#nogo"><span><img src="pic/fullsize3.jpg"
width="402" height="288" /><br />
<br /></span></a>
<a class="gallery slided" href="#nogo"><span><img src="pic/fullsize4.jpg"
width="402" height="288" /><br />
<br /></span></a>
</div>
</div>
</div>
</body>
</html>

Oli Filth · Sep 5, 2005

Per W. said the following on 05/09/2005 20:06:

Hi, i am trying to help someone with some code for a simple photoalbum, its
okey in IE and in FF, but in Opera the selected picture is not showing, in
both IE and FF the picture is showing in fullsize when hover over the
thumnails, but in Opera the picture is behind the background picture, i have
tried som z-index, but then FF is going bananas.

<SNIP CODE>

Can you post a URL with an example of this behaviour? Otherwise,
someone's going to have set up a page themselves and make a load of
pictures before they can test this code and help you...

Per W. · Sep 6, 2005

Oli Filth said:
Per W. said the following on 05/09/2005 20:06:

<SNIP CODE>

Can you post a URL with an example of this behaviour? Otherwise, someone's
going to have set up a page themselves and make a load of pictures before
they can test this code and help you...

Ok, her is the link http://www.odj.no/b2.htm There is some differense in the
code and my code example in the original posteing, but thats becuse i have
removed everything that dont has any thing to do with the error.

/Per W.

Ed Jay · Sep 6, 2005

Per W. said:
Ok, her is the link http://www.odj.no/b2.htm There is some differense in the
code and my code example in the original posteing, but thats becuse i have
removed everything that dont has any thing to do with the error.

For starters, you rely on a hover pseudo class, 'focus,' that doesn't seem
to be defined for the 'a' style definition. You depend on hover to switch
images.

I also note that when I load your page in Opera (8.02), and hover over a
thumbnail, that action generates a horizontal scroll bar that goes way out
to the right.

I'm still learning this CSS stuff, but I've learned that Opera won't let
me do a lot of things that FF and IE seem to forgive. From the little I've
learned about CSS, you have several style errors that Opera won't let you
get away with.

Ed Jay (remove M to respond)

Help with Visual Lightbox: Scripts	2	May 3, 2023
Please Help?	0	Jul 23, 2022
I am trying to detect Which image id="" was clicked ?	22	Jan 3, 2023
Script working in Firefox but not Chrome and Safari	3	Apr 6, 2021
Need help , Having problem with Drag n Drop ?	9	Dec 21, 2022
How do I fix this issue in sqaurespace code block?	1	Jul 2, 2024
Working on mobile css menu with plenty of frustration!	2	Dec 29, 2022
SendGrid email issue in responsive Gmail	1	Nov 4, 2021

Problem in Opera but not in IE and FF

Per W.

Oli Filth

Per W.

Ed Jay

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads