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


Recent Events
  • 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.

  • 14/04/2017 Happy Easter

    Wish a Happy Easter and give 30% discount for all our WordPress and Joomla! extensions. Use EASTER17 coupon code. The offer is valid till 17 April.


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, 1 Month 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, 1 Month ago Karma: 667
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, 1 Month 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, 1 Month 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, 1 Month 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