Hi CC
I have a file 'slide-up.rsd' (attached .. sorry about zip files but wont upload .rsd) that brings up a panel from below when hovering over the red panel (container) at the bottom. The problem is that the 'hover' state doesn't work on touch screens.

On the file 'slide-up2.rsd' (attached) ive used a link container. this seems to work ok going up in 'RSD preview' but does not scroll down when clicking on the container link panel again, it just makes it move up again.
When clicking outside the panel the container panel downs scroll down again with a smooth transition.

Also in the 'Chrome' preview nothing much seems to work at all!

If its possible i would like the container panel to move up on a click and move down on a click (moving the panel down on a click weather clicking inside the container panel or outside it.)

any suggestions? (also cant figure out why something works in RSD preview and not Chrome?)

Thanks Tim

I have tried unsuccessfully to do the same thing you are trying. Most developers when researching this on the net will advise not to try to acheive this because you really must provide some kind of "hint" that a transition resides in the container for mobile touch. However I do like the plus sign in your project file and it does hint loudly to click, hover or touch me.

You can replace the hover and use mouseenter and mouseleave. This will require jquery to use addclass and removeclass.

The addclass is not so hard but acheiving removeclass relies on a click outside the area, or a button that says "close me", or somehow link into another "touch event" or even better the user scroll of the screen causing the "effect" to resume to the "normal state". I hope someone has a simple answer because this project I was experimenting with was shelved and is collecting dust.

Here was some example jquery code:



It does require you to add a custom data attribute call data-tog with the value of "nest1". I was trying to allow for mutiple toggling of element groups so that more than one element could be toggled off of one element id.

I just remembered that Foundation 6 has a powerful built-in feature called the Toggler which can target multiple elements also and does not require any jquery.

https://foundation.zurb.com/sites/docs/toggler.html

Thanks Twinstream
I’ll look into it
T.