[habs]

mmk so im trying to get this to work and its giving me grief.

the code is this:

[attr="class","bleeeh"]blah

[newclass=".bleeeh"]-webkit-transition: height .5s; transition: height .5s; width: 250px; height: 15px; overflow: hidden; color: transparent;[/newclass][newclass=".bleeeh:hover"]-webkit-transition: height .5s; transition: height .5s; width: 250px; height: 175px; color: #333; background: #0000ff;[/newclass]

so basically i want the blue box to slide down and slide back up, when you hover on/hover off. it slides down fine but when you slide off it just disappears abruptly. it does work if i put "all" instead of "hieght" on the first newclass (the non-hover one) but that doesn't give me the effect i want.

is there anything else i can do? D:

[eden]

by the "all" not giving you the effect you want, do you mean that it makes the blue box fade out while sliding away? because i know of a way to make the sliding "sharper", but idk if it's what you're asking for? it makes use of the "all" transition rather than the "height" one, so instead of adjusting the height of the box, the hover essentially just pulls it down. also, the transition in your current code only seems to work if you hover near the top. the code below works in a way that anywhere you hover on the grey box will pull down the blue one, but again, idk if that's something you want. this may not be the ideal solution, but it was what i could come up with — if it's not what you were looking for, i hope it'll at least be of some help?

also, i don't quite know how to explain how it works and am a horrible teacher, but if you take a look at the code, you should be able to figure it out. there are probably easier ways to go about this than what i've done, but unfortunately i don't know them. xD hopefully someone else can help out if this doesn't work for you!

---

[attr="class","bleeh"]

[attr="class","bleeh2"]blah

[newclass=".bleeh"]position: relative; overflow: hidden; width: 250px; height: 175px;[/newclass]
[newclass=".bleeh2"]position: absolute; top: -175px; width: 250px; height: 175px; background: #0000ff; -webkit-transition: .5s all; transition: .5s all;[/newclass]
[newclass=".bleeh:hover .bleeh2"]-webkit-transition: .5s all; transition: .5s all; top:0px;color: #333;[/newclass]

[habs]

MY GOD THIS IS EXACTLY EXACTLY EXACTLY WHAT I WANTED!

thank you so much oh my god idk i wish i could give you like a high five but THANK YOU