Tooltips icons location and tooltips window overflow off the page - Support

Viewing 5 posts - 1 through 5 (of 5 total)

Author

Posts
August 1, 2015 at 4:16 pm #481684
Barnez1
Participant
Hi,

There doesn’t seem to be any existing support threads for this particular tooltips issue:

1. When I create and position the tooltips the option is only for right or left align. Is it possible to have the tooltip icon placed just after the last item of text on a line, rather than at the right hand margin.

2. Also in this same bulleted section, the tooltips in the right hand column overflow off the page when open. This happens on both desktop and mobile screens. Can this be solved without needing to reduce the column widths on this page to 2/5 + 2/5?

Thanks,
Barnez
- This topic was modified 9 years, 4 months ago by Barnez1.
August 3, 2015 at 12:06 pm #482024
Barnez1
Participant
I’ve found this in js>>avia.js on line 1757-1772
```
	$.AviaTooltip  =  function(options)
	{
	   var defaults = {
            delay: 1500,                //delay in ms until the tooltip appears
            delayOut: 300,             	//delay in ms when instant showing should stop
            delayHide: 0,             	//delay hiding of tooltip in ms
            "class": "avia-tooltip",   	//tooltip classname for css styling and alignment
            scope: "body",             	//area the tooltip should be applied to
            data:  "avia-tooltip",     	//data attribute that contains the tooltip text
            attach:"body",          	//either attach the tooltip to the "mouse" or to the "element" // todo: implement mouse, make sure that it doesnt overlap with screen borders
            event: 'mouseenter',       	//mousenter and leave or click and leave
            position:'top',             //top or bottom
            extraClass:'avia-tooltip-class', //extra class that is defined by a tooltip element data attribute
            permanent: false 			// always display the tooltip?
            
        }
```
Is there any possibility for a position:”left or float:’left’?
August 3, 2015 at 1:00 pm #482059
Ismael
Moderator
Hey!

Thank you for using Enfold.

You can’t set the tooltip to align left or right but you can adjust the position in the Quick CSS field:
```
#top .avia-icon-tooltip {
    margin-left: -50px;
}

.avia-tooltip .avia-arrow-wrap {
    margin-left: 43px;
}
```
Regards,
Ismael
August 3, 2015 at 3:15 pm #482133

Barnez1
Participant

Hi Ismael,

This theme is fantastic, and I’m really pleased with my decision to choose it over the two others I was considering!

Your suggested css was excellent. The only thing I needed to do was to increase the margin left to -90 to allow the tooltip windows to show on a narrow mobile screen.

Many thanks for your help!

August 4, 2015 at 7:37 am #482535

Ismael
Moderator

Hi!

Glad it worked. Again, thank you for using the theme. :)

Cheers!
Ismael
Author

Posts

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Tooltips icons location and tooltips window overflow off the page’ is closed to new replies.