webForumDet fria alternativet

onMouseOver = Visa/dölj DIV

HTML & CSS

9 svar · 568 visningar · startad av learn

Medlem sedan jan. 20051 130 inlägg
Frågan#1

Jag har en div som jag vill låsa till en viss höjd med scrollning. Varje rad (p) är relativt lång och därför skall div:ens bredd också vara låst men istället för en scroll här så skall div:en öka i bredd när man håller musen över.

Koden ser nu ut så här:

<style type="text/css">
p {
padding:5px 3px;
width:700px;
background-color:#CCC;
}
div {
margin:20px;
width:400px; 
height:200px; 
overflow-y:scroll; 
overflow-x:hidden
}
</style>

<div id="test" onMouseOver="test.style.width='700px'" onMouseOut="test.style.width='400px'">
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
<p>Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
</div>

Detta funkar precis som jag vill i IE. Men i FF och Opera vill det sig inte riktigt. "overflow-y:scroll; overflow-x:hidden" tycks inte tolereras. Why (ska tydligen funka )?

Testa koden i IE så får ni se hur jag vill ha det i alla webbläsare... :)

Medlem sedan dec. 20042 245 inlägg
#2

Vilken version av Firefox har du?

Medlem sedan jan. 20051 130 inlägg
#3

zcorpan skrev:

Vilken version av Firefox har du?

1.0.6.

Jag kan ju göra så här:

overflow:auto; /* 1 */
overflow-y:scroll; overflow-x:hidden; /* 2 */
overflow:-moz-scrollbars-vertical; /* 3 */

Där 1 är för Opera, 2 för IE och 3 för FF. Känns ju lite löjligt men, men... Problemet kvarstår dock i Opera där den horizontella scrollen fortfarande syns (vid onMouseOut).

Medlem sedan dec. 20042 245 inlägg
#4

Testa Firefox 1.5 istället. :)

Medlem sedan nov. 20051 596 inlägg
#5

Ta bort test. i koden och ha bara style.width= kvar

Medlem sedan jan. 20051 130 inlägg
#6

zcorpan skrev:

Testa Firefox 1.5 istället. :)

Nja, jag vill ju licksom att det ska funka för "alla"...

Medlem sedan nov. 20051 596 inlägg
#7

Jag måste bara fråga om inte mitt tips fungerade?
Till att börja med reagerade ff hos mig som att det var ett javascript i koden. Mycket underligt beteende och inte förrän jag tog bort test. så slutade den validera allt som eventuellt kunde vara javascript på min dator. Länkar, andra öppna sidor, t.o.m. googles sökruta...!
Sedan fungerade även din kod. Fungerar även i IE.

Medlem sedan jan. 20051 130 inlägg
#8

tanten, tar man bort tips så flippar Opera som för den delen även vill ha document.

Medlem sedan nov. 20051 596 inlägg
#9

OK :(
Då funkar din kod med test. hos mig i ff om man använder
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
med strict eller högre högre så blir det javascriptfel direkt.
Någon får gärna förklara detta för mig... :q
Fungerar inte heller i någon av dem om jag stänger av javascript.

Medlem sedan nov. 20041 189 inlägg
#10

http://bennolan.com/behaviour/
bättre än
<a href="#" onclick="...">.</a>

255 ms totalt · 4 externa anrop · v20260731065814-full.1dc6f849
124 ms — deklarationer (db)
0 ms — hämta statistik (cache)
128 ms — hämta tråd, inlägg och bilagor (db)
123 ms — ändringar (db)