diametric menu preset switcher
-
-
- Yael
- Jr. Rocketeer
- Posts: 24
- Thanks: 0
-
Hello,
I experience trouble to convert demo diametric template preset switcher to my own menu.
I have not find the guide how to make such menu and tried to edit it.
I have edited picture and tried to edit css class but after that the menu background image dissapeared. I have rolled back css and even picture but failed to get back it to work. Would you mind to help with my issue?
my site is: mbfan.ru/
the menu item I tried to edit is the 5th from the left.
Thank you in advnace,
Yael
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
this is the html code of the module:
<div class="menu-preset preset1"><a class="rt-floatleft nomarginright" href="?presets=preset1"><span></span></a></div> <div class="menu-preset preset2"><a class="rt-floatleft nomarginright" href="?presets=preset2"><span></span></a></div> <div class="menu-preset preset3"><a class="rt-floatleft nomarginright" href="?presets=preset3"><span></span></a></div> <div class="clear"> </div> <div class="menu-preset preset4"><a class="rt-floatleft nomarginright" href="?presets=preset4"><span></span></a></div> <div class="menu-preset preset5"><a class="rt-floatleft nomarginright" href="?presets=preset5"><span></span></a></div> <div class="menu-preset preset6"><a class="rt-floatleft nomarginright" href="?presets=preset6"><span></span></a></div> <div class="clear"> </div> <div class="menu-preset preset7"><a class="rt-floatleft nomarginright" href="?presets=preset7"><span></span></a></div> <div class="menu-preset preset8"><a class="rt-floatleft nomarginright" href="?presets=preset8"><span></span></a></div> <div class="menu-preset preset9"><a class="rt-floatleft nomarginright" href="?presets=preset9"><span></span></a></div> <div class="clear"> </div> <div class="menu-preset preset10"><a class="rt-floatleft nomarginright" href="?presets=preset10"><span></span></a></div> <div class="menu-preset preset11"><a class="rt-floatleft nomarginright" href="?presets=preset11"><span></span></a></div> <div class="menu-preset preset12"><a class="rt-floatleft nomarginright" href="?presets=preset12"><span></span></a></div>
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
this is the code in the css (demo-styes.css) ...
/* Menu Styles */ .fusion-modules.item, .fusion-modules.item:hover {margin:5px 10px !important;border:0 !important;padding:0 !important;} .menu-preset {float: left;margin: 1px;} body .menutop li .menu-preset > a > span {display:block;width:100px !important;height:93px !important;background:url(../../../images/stories/demo/general/preset-style-icons.png);padding:0 !important;margin:0 !important;border-radius:0 !important;z-index:9;border:0 !important;cursor:pointer;} body .menutop li .menu-preset > a > span:hover {margin:0 !important;padding:0 !important;z-index:10;border:0 !important;cursor:pointer;} .preset2 > a > span {background-position: -100px 0 !important;} .preset3 > a > span {background-position: -200px 0 !important;} .preset4 > a > span {background-position: 0px -93px !important;} .preset5 > a > span {background-position: -100px -93px !important;} .preset6 > a > span {background-position: -200px -93px !important;} .preset7 > a > span {background-position: 0px -186px !important;} .preset8 > a > span {background-position: -100px -186px !important;} .preset9 > a > span {background-position: -200px -186px !important;} .preset10 > a > span {background-position: 0px -279px !important;} .preset11 > a > span {background-position: -100px -279px !important;} .preset12 > a > span {background-position: -200px -279px !important;}
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
this is the sprite with the icons:
demo.rockettheme.com/joomla25/diametric/...eset-style-icons.png
-
Time to create page: 0.057 seconds