softwaretailoring / wheelnav

Animated wheel navigation JavaScript library based on Raphaël.js (SVG/VML). It can be a pie menu (radial menu, circular menu) and many more.
https://wheelnavjs.softwaretailoring.net
MIT License
702 stars 101 forks source link

z-index two wheels #77

Closed yoan1005 closed 6 years ago

yoan1005 commented 6 years ago

Hi, I use your plugin for make a menu, after 2 days i have almost solved all my problems, but one persist. I have many wheels, and when i click on main wheel, the corresponding wheel appear. It's work but i would like that the main wheel are always on top by other like z-index : 10 for main wheel and all others sub wheel are z-index 1,2,3,4……

The example here, the blue is main wheel and red are sub wheel. https://jsfiddle.net/je5juLvg/

Can do that you think ? Thaaank ! sry for my english

softwaretailoring commented 6 years ago

Hi @yoan1005 You can achieve it via JavaScript: wheel1.navItems[0].navSlice.toFront();

yoan1005 commented 6 years ago

Hum, thanks for your anwser, i have tried to put all navitems in "toFront()" wheel1.navItems[0].navSlice.toFront(); wheel1.navItems[0].navLine.toFront(); wheel1.navItems[0].navTitle.toFront(); wheel1.navItems[1].navSlice.toFront(); wheel1.navItems[1].navLine.toFront(); wheel1.navItems[1].navTitle.toFront(); wheel1.navItems[2].navSlice.toFront(); wheel1.navItems[2].navLine.toFront(); wheel1.navItems[2].navTitle.toFront(); wheel1.navItems[3].navSlice.toFront(); wheel1.navItems[3].navLine.toFront(); wheel1.navItems[3].navTitle.toFront(); wheel1.navItems[4].navSlice.toFront(); wheel1.navItems[4].navLine.toFront(); wheel1.navItems[4].navTitle.toFront();

and set to false for subwheels

but result are same.. during transition the red is above the blue

see here https://jsfiddle.net/je5juLvg/3/

softwaretailoring commented 6 years ago

You must use it inside navigateFunction: https://jsfiddle.net/je5juLvg/4/

yoan1005 commented 6 years ago

Ohhh perfect ! thanks u !