Print Page | Close Window

How to use Collapsible Panel as a drop down menu?

Printed From: Forum openElement
Category:

openElement


Forum Name: openElement General Discussion
Forum Description: A place for general discussion and questions about the software.
URL: http://forum.openelement.com/fr/forum_posts.asp?TID=1546
Printed Date: 29 Jan 2020 at 00:15
Software Version: Web Wiz Forums 10.11 - http://www.webwizforums.com


Topic: How to use Collapsible Panel as a drop down menu?
Posted By: Avinoam
Subject: How to use Collapsible Panel as a drop down menu?
Date Posted: 11 Août 2019 at 14:00
Hi,

I am a newbie to openElement, I am trying to figure it out. I want to use Collapsible Panel as a dropdown menu panel (I don't want to use the popup panel). My questions are:

1. How do I replace the black image with the drop with some text or at least another image.
2. How can I cause the panel to collapse back when mouse is not over it - without having to press the header image?

Thanks,
Avi


-------------
Thanks!



Replies:
Posted By: Hobby001
Date Posted: 12 Août 2019 at 23:01
Hi,

Questions: 

What is your level of comfort with javascript and CSS?

How do you plan to use the collapsible pannel on a mobile device where no mouse is available?









Posted By: Avinoam
Date Posted: 12 Août 2019 at 23:34
I have some experience with both. I have no need for a mobile version. thx.

-------------
Thanks!


Posted By: Hobby001
Date Posted: 13 Août 2019 at 03:26
Put all the controls into a group of elements A with a negative left margin equivalent to it's width and a custom class named slide

Put group of elements A in a second group of elements B with overflow hidden with and custom class slideBox

CSS code:

.slide{
margin-left:-350px; /* 350px being the width of group A*/
transition: all 1s;
}

.slideBox:hover .slide{
margin-left:0;
}




Posted By: Avinoam
Date Posted: 17 Août 2019 at 22:43
Hi,

Thank you so much. This was very helpful.


-------------
Thanks!


Posted By: Hobby001
Date Posted: 18 Août 2019 at 00:21
Thanks for the feedback.  It's allways appreciated



Print Page | Close Window

Forum Software by Web Wiz Forums® version 10.11 - http://www.webwizforums.com
Copyright ©2001-2012 Web Wiz Ltd. - http://www.webwiz.co.uk