PHP Developers Network

A community of PHP developers offering assistance, advice, discussion, and friendship.
 
Loading
It is currently Thu Sep 24, 2020 5:04 pm

All times are UTC - 5 hours




Post new topic Reply to topic  [ 4 posts ] 
Author Message
PostPosted: Fri Jul 10, 2015 3:51 am 
Offline
DevNet Master

Joined: Wed Oct 08, 2008 3:39 pm
Posts: 4434
Location: United Kingdom
I'm trying to make a little support dropdown appear, and this seems to be the simplest of things.
So when you hover over one DIV, the other DIVs display become 'block'. But it's not working.

What I am doing wrong?

Syntax: [ Download ] [ Hide ]
<style>
.template_contact_info
{
display: none;
background-color: #ffffff;
width: 250px;
border: 1px solid #000000;
z-index: 170;
position: absolute;
left: 698px;
top: 54px;
padding: 7px;
line-height: 25px;
}

.template_contact:hover .template_contact_info
{
display: block;
}
</style>

<span class='template_contact'>&#9660;</span>
<div class='template_contact_info'>ads fas dfas fd<br/>adfadfasfd</div>
 

_________________
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.


Top
 Profile  
 
PostPosted: Fri Jul 10, 2015 4:46 am 
Offline
DevNet Master

Joined: Wed Oct 08, 2008 3:39 pm
Posts: 4434
Location: United Kingdom
This is another option and I have made this one work.

The only issue with it, is user friendliness.

If you click the link to dropdown the DIV (checking the hidden box), you cannot just click away.

So can it be altered to "lose focus"... and then the DIV hides again?

_________________
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.


Top
 Profile  
 
PostPosted: Fri Jul 10, 2015 6:34 am 
Offline
Moderator
User avatar

Joined: Tue Nov 09, 2010 3:39 pm
Posts: 6425
Location: Montreal, Canada
.template_contact_info is not a child of .template_contact, but your CSS is treating it as though it were. Are you trying to do something like this?
http://codepen.io/anon/pen/OVZzbb

_________________


Top
 Profile  
 
PostPosted: Fri Jul 10, 2015 7:34 am 
Offline
DevNet Master

Joined: Wed Oct 08, 2008 3:39 pm
Posts: 4434
Location: United Kingdom
I've made it work with a click, but how do I make it disapear by clicking away.
For now, I've added the same button to mke it appear, in the box that then makes it go. But be nice if a "click" away would do it...

_________________
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 4 posts ] 

All times are UTC - 5 hours


Who is online

Users browsing this forum: No registered users and 5 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Jump to:  
Powered by phpBB® Forum Software © phpBB Group