Categories
Categories:   All Categories
Suggested keywords
x
New

calendar popups display under other content

JEvents (Free Access)
  JEvents (Free Access)
bdtc
  bdtc
  Saturday, 16 May 2015
  10 Replies
  5K Visits
0
Votes
Undo
I tried using z-index on the parent div but to no avail. No matter what I do the popups display under the adjacent columns.

www tennisbaiedurfe com/http://index.php/en/schedule/month.calendar/2015/05/16/-

See event 'test'.

Any ideas how to fix this? If I could find the css for the popup maybe setting its z-index would help.

Thanks.
Oldest First  
geraint
geraint
Sunday, 17 May 2015 11:49
·
#148476
0
Votes
Undo
Try checking the container elements further up the DOM hierarchy
JEvents Club members can get priority forum support at the Support Forum. As well as access to a variety of custom JEvents addons and benefits. Join the JEvents club today!
bdtc
bdtc
Sunday, 17 May 2015 13:04
·
#148477
0
Votes
Undo
Column elements are floated, that could be the problem.

Is there a way to force tooltips to display only within the calendar?

One workaround would be to make sure text in event tittle and description are short enough to not extend out of the calendar div....
geraint
geraint
Sunday, 17 May 2015 15:29
·
#148478
0
Votes
Undo
Even if the columns are floated you should be able to set the z-index on the main content area to be higher than the module columns.
JEvents Club members can get priority forum support at the Support Forum. As well as access to a variety of custom JEvents addons and benefits. Join the JEvents club today!
bdtc
bdtc
Tuesday, 19 May 2015 23:00
·
#148479
0
Votes
Undo
No matter what I do the popup is clipped by columns on the side. I set left and right columns to z-index 0 and 1, centre to 999. I set overflow for class .maintable to visible. No effect.

For now I want to restrict the popup to the "jevents" div.

I am willing to look through the code but I do not know javascript. Any pointers?

Thanks.
tonyp
tonyp
Tuesday, 19 May 2015 23:44
·
#148480
0
Votes
Undo
Set the z-index to: 99999

Failing that, provide us with a link and if it's a quick find we will happily help.

Thanks
Tony
JEvents Club members can get priority forum support at the Support Forum. As well as access to a variety of custom JEvents addons and benefits. Join the JEvents club today!Join the JEvents club today!
bdtc
bdtc
Wednesday, 20 May 2015 11:27
·
#148481
0
Votes
Undo
No, setting content section to z-index 99999 did not help.

2 things I found searching:

I was able to solve the problem by setting data-container="body" on the html element

HTML example:

<a href="#" data-toggle="tooltip" data-container="body" title="first tooltip">

    hover over me

</a>


JavaScript example:

$('your element').tooltip({ container: 'body' })


And from w3schools:

Note: z-index only works on positioned elements (position:absolute, position:relative, or position:fixed).


Maybe the 'container:body' idea would work.

I will try it in js if you point me in the right direction.

Here is the link to my site:

www tennisbaiedurfe com/http://index.php/en/schedule/month.calendar/2015/05/16/-

See event 'test'.
tonyp
tonyp
Wednesday, 20 May 2015 12:52
·
#148482
0
Votes
Undo
I'm not getting anything to pop-up for me? Please explain how to replicate the popup?
JEvents Club members can get priority forum support at the Support Forum. As well as access to a variety of custom JEvents addons and benefits. Join the JEvents club today!Join the JEvents club today!
geraint
geraint
Wednesday, 20 May 2015 13:46
·
#148483
0
Votes
Undo
These are popovers not tooltips but the principal would still work.

Try changing line 161 of components/com_jevents/views/ext/month/tmpl/calendar_cell.php which currently reads:

JevHtmlBootstrap::popover('.hasjevtip' , array("trigger"=>"hover focus", "placement"=>"top", "container"=>"#jevents_body", "delay"=> array( "hide"=> 150 )));

Or use the sort of CSS I was suggesting earlier 
body > div.container > .row > div:first-child {

    z-index: 10;

}
JEvents Club members can get priority forum support at the Support Forum. As well as access to a variety of custom JEvents addons and benefits. Join the JEvents club today!
bdtc
bdtc
Thursday, 21 May 2015 11:13
·
#148484
0
Votes
Undo
Adding the CSS you posted did it. Popover now displays over the columns. I dont quite understand the CSS with the >'s but I will look that up.

Thanks for your time helping me solve this! Much appreciated!
tonyp
tonyp
Thursday, 21 May 2015 21:20
·
#148485
0
Votes
Undo
Great to hear! Thanks for letting us know :-).
JEvents Club members can get priority forum support at the Support Forum. As well as access to a variety of custom JEvents addons and benefits. Join the JEvents club today!Join the JEvents club today!
  • Page :
  • 1
There are no replies made for this post yet.