Home News Contact Us Forum About Us Demos Products F.A.Q.
Shopping Cart
You currently have 0 items in your cart.


Recent Events
  • 18/11/2017 Black Friday is coming

    Don't wait BLACK FRIDAY, use FRIDAY17 coupon code to get 35% discount for all our extensions right now.

  • 05/09/2017 BIG Autumn SALE

    Use AUTUMN17 coupon code to buy our WordPress or Joomla! extensions with 25% discount. Hurry up! The offer is valid till 11 September.


2Checkout.com, Inc. is an authorized retailer of goods and services provided by ARI Soft. 2CheckOut




Follow us on twitter



Welcome, Guest
Please Login or Register.    Lost Password?

ARI Menu float out to left
(1 viewing) (1) Guest
Go to bottomPage: 1
TOPIC: ARI Menu float out to left
#55699
ARI Menu float out to left 2 Years, 3 Months ago Karma: 0
Hello,

I want to use the ARI menu on the RIGHT hand side of a website with the sub menus expanding to the left over the content. Like:-

Menu item 1
Menu item 2
Sub Menu item 1..................
Sub Menu item 2..................
Sub Sub Menu item 1....................................
Menu item 3


1. Is this possible?

2. If yes, can I achieve this with a CSS change or would it require a rework of the code?

Cannot see any RTL options in the settings.

Regards

Ian.
The administrator has disabled public write access.
 
#55708
Re:ARI Menu float out to left 2 Years, 3 Months ago Karma: 670
Hello,

The extension doesn't support this ability.

Regards,
ARI Soft
The administrator has disabled public write access.
 
#55711
Re:ARI Menu float out to left 2 Years, 3 Months ago Karma: 4
I have a feeling this can be done in css by using floating as well as negative margins.

Edit:

Altered the code on my own site in the developer's tool to make it look like this:
Used ARI ext menu over there for parts of the site.

Last Edit: 2015/09/05 05:28 By Mazfer.
The administrator has disabled public write access.
Mazfer
- Long time CSS/HTML coder
- mazindesigns.com
 
#55720
Re:ARI Menu float out to left 2 Years, 3 Months ago Karma: 0
Hi Mazfer,

Thanks for that. Looks like the way I want to make my menu work. Can you point me to the CSS you changed?

The developer tool? Is that a browser extension or another ARI mod to develop this code?

I use firebug so can probably trace the CSS but a shortcut would be much appreciated, thanks.

Ian.
Last Edit: 2015/09/07 13:06 By IanL.Reason: correcting spelling
The administrator has disabled public write access.
 
#55721
Re:ARI Menu float out to left 2 Years, 3 Months ago Karma: 4
The developer tool in Chrome is equal to firebug in firefox, so yes.. it's a browser feature.


The following code is done based on a fresh install of the ARI ext menu.

---
.ux-menu {
display: block;
width: 200px; /*width + display to prevent the menu items from lining up next to each other*/
float: right; /*will push the element to the right-hand side of its parent element*/
}


.ux-menu li {
width: 200px; /*needs to be the same width as in .ux-menu*/
display: block;
float: right;
height: 35px; /*set a height to prevent the gap appearing when hovering the item*/
}



.ux-menu li .ux-menu-sub {
position: absolute; /*default setting for the module*/
left: -200px !important; /*pushes the sub-menu to the left*/
top: 0 !important; /*pushes the sub-menu to the top of its parent item*/
}

---

Hope that helps.


edit: in addition you can play around with css3 transition effects to make it look more like the submenu actually "flys out" from its parent item.
Last Edit: 2015/09/07 14:10 By Mazfer.
The administrator has disabled public write access.
Mazfer
- Long time CSS/HTML coder
- mazindesigns.com
 
Go to topPage: 1