Jump to content

Recommended Posts

Im trying to figure out the best means of approaching having dynamically created elements expand when hovered over. I know JS will have a hand in handling the effect but that I'm not to concerned about so much as having the CSS back it up so it all positions correctly after things are said and done. Now generally expanding an element I know is just height/width. But I want to have it so the element expands in its current spot but overlays the rest of the content, without effecting the content by pushing it one way or another. I hope that makes sense, best example I can think of off the top of my head is when you go to a code snippet site and when you mouse over the code shown. the element expands to show all the code while leaving everything else intact...

Link to comment
https://forums.phpfreaks.com/topic/238111-slide-out/
Share on other sites

i have a seen quite a few of your questions now, and before i give a hint i recommend you just buy a manual for css. everything you asked so far is so basic, that even if you would google for it, it should pop up. Adn i don't mean to insult anyone here, but reading a decent books takes you only a week or so. If i were you I would do that.

 

Now back to you question.

the properties you need are position: absolute. z-index and pseudo hover.

 

Link to comment
https://forums.phpfreaks.com/topic/238111-slide-out/#findComment-1224639
Share on other sites

I have plenty of books lol grant it I don't read them cover to cover like I should. But of them I have never really seen what I'm trying to convey here, maybe its because I am just putting more thought into it, and in concept most of my questions here recently revolve similar properties I know that much. I'm just trying to figure out the best approach before I spend I dunno how long being frustrated on concept.

 

My weak visual attempt and trying to show what I mean (just picture the lower half of the representation sliding out to where it is from where it was on the upper half (which that yes I know again is JS related to make that portion happen, but again its the positioning I am stuck on as far as the CSS portion of it goes.)..

example1.png

Link to comment
https://forums.phpfreaks.com/topic/238111-slide-out/#findComment-1224730
Share on other sites

i just posted a link on another question of yours, I recommend to check that out it shows what i meant. only thing extra is the pseudo hover class, but that isn't rockets science either.

 

#element{
position: /*anything other than static */ ;
}

#element:hover{
  z-index:10;
}

Link to comment
https://forums.phpfreaks.com/topic/238111-slide-out/#findComment-1224751
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.