You will recieve your password to this address. Address is not made public.

Your preferred username that is used when logging in.

Positioning IE7 vs FF3.5 Created Nov 14, 2009

This thread is solved

Views: 4317     Replies: 21     Last reply Oct 26, 2010  
You must login first before you can use this feature

Mastercafe
Juan Menendez http://www.mastercafe.com Integration jQuery framework on MBC info@mastercafe.com

Posts: 6

Registered:
Nov 14, 2009

Positioning IE7 vs FF3.5

Posted: Nov 14, 2009

I try to do the sample tooltip basic simple and have many problems on position.
Try to do position:relative on different DIV areas, so haven't solved. And the offset is different on FF3.5 and IE7, each one calculate different y value to solve with offset.
The url is http://www.mastercafe.com/sql/index.asp?bd=data&id=1355&zona=jquery&idm=es&web=po&eve=zz

Any ideas? Some CSS code to correct?

tr309

Posts: 2

Registered:
Nov 19, 2009

» Positioning IE7 vs FF3.5

Posted: Nov 19, 2009

Reply to: Positioning IE7 vs FF3.5, from mbcinternet
I'm having a similar issue. When the browser window is resized the offset for the tooltips is also changed.

http://kinodev.co.uk/

Hover the mouse over one of the events in the calendar on the right. You might be able to see a tooltip. Then resize the browser window e.g. make it really narrow and hover over another event. The tooltips move quite a distance.

Also when I view in different browsers i.e. Firefox, Safari and IE the tooltips show up in different positions. I stand no chance of correcting this via CSS.

Any ideas?

Thanks,

Richard

tr309

Posts: 2

Registered:
Nov 19, 2009

FIXED

Posted: Nov 20, 2009

Reply to: » Positioning IE7 vs FF3.5, from tr309
The problem I was having was due to the position of the tooltip div within my page. I have now moved it to the very bottom of the document just before the </body> tag so it now reads:

<div id="event-tooltip" class="hide"></div>
</body>
</html>
This has solved the problem in all major browsers.

Rich

Mastercafe
Juan Menendez http://www.mastercafe.com Integration jQuery framework on MBC info@mastercafe.com

Posts: 6

Registered:
Nov 14, 2009

I will try this

Posted: Nov 20, 2009

Reply to: FIXED, from tr309
I will try to do this, could be a goog idea because with this you get out of relative/absolute div position from other div's.

Effectivelly the solution is put DIV at bottom of total code and then this problem was solved.
You can see on our web for samples:
http://www.mastercafe.com/sql/index.asp?bd=data&id=1355&zona=jquery&idm=es&web=po&eve=zz

diezjietal

Posts: 2

Registered:
Nov 25, 2009

offset in IE7

Posted: Nov 25, 2009

Reply to: I will try this, from mbcinternet
I have a similar problem but I think everything is coded correct (CSS, xHTML, JS).

Offset in Standards Aware browsers is correct but in IE7 the offset seems to be calculated from the top edge of the element instead from the bottom edge of the element.

Any ideas?

Mastercafe
Juan Menendez http://www.mastercafe.com Integration jQuery framework on MBC info@mastercafe.com

Posts: 6

Registered:
Nov 14, 2009

Better solution using jQuery

Posted: Nov 25, 2009

Reply to: offset in IE7, from diezjietal
Try to use this code
$("selector").appendTo("body");

With this you put directly the div on body and solve relative/absolute nested div's that could be affect to the positioning.

diezjietal

Posts: 2

Registered:
Nov 25, 2009

offset in IE7 solution

Posted: Nov 26, 2009

Reply to: Better solution using jQuery, from mbcinternet
found the solution.

Was using the tooltip over an image wrapped with a link in an unordened list.

Setting the link to display: block; fixed everything.

MasonShew

Posts: 4

Registered:
Oct 28, 2009

Fixed my FF offset issue

Posted: Jan 19, 2010

Reply to: offset in IE7 solution, from diezjietal
I was having the same problem in Firefox (3.5), but was unable to use display:block on my image for other layout reasons.

However, I noticed that I added align="absmiddle" to the image. Once I removed it, the tooltip offset displayed correctly.

Funny how FF was the only browser that got upset by that.

mrmartineau

Posts: 2

Registered:
Nov 9, 2009

It works!

Posted: Dec 2, 2009

Reply to: I will try this, from mbcinternet
Placing my tooltip before the </body> worked a treat for me, this should also fix a problem with something else I was having from the other day. Cheers

glennfu

Posts: 3

Registered:
Mar 15, 2010

» It works!

Posted: Mar 15, 2010

Reply to: It works!, from mrmartineau
Thanks for this tip, it helped me out too!

redani

Posts: 39

Registered:
Aug 10, 2009

» » Please help!

Posted: Aug 28, 2010

Reply to: » It works!, from glennfu
hey guys, hope you had or still having a great summer!
I'm trying to solve a little problem that i have but i just can't figure it out!
i'm having tooltip with an HTML content, positioned with " position: 'bottom center', offset: [9, 49]" but it's displayed between 3 and 15px in the right depending on the browsers. here is the link and it's when you hover "Help"http://www.moroccan-arts.co.uk/test-index.php

I tried to put the tooltip div in the bottom of the page but I get a mess in this sub menu: "Your account" disappears and looks like "Your account" a-is taken as the tooltip.

thank you so much for your help
Reda

msealey

Posts: 8

Registered:
Aug 23, 2010

Different values for X, Y in Offset too

Posted: Sep 8, 2010

Reply to: » » Please help!, from redani
I have my JavaScript thus:
<script type="text/javascript" >

$(document).ready(function() {

$("#trigger").tooltip({

effect: 'fade',

opacity: .7,

bounce: false,

position: 'bottom left',

offset: [-160,-45]

});
which places my tooltip in different positions for Safari/FF on Mac correctly, but wrong by several tens of pixels in IE/FF on Windows.

redani

Posts: 39

Registered:
Aug 10, 2009

» Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: Different values for X, Y in Offset too, from msealey
I kinda found a solution. place your tooltip div in the end, just before the </body> and it'll fix your problem
you can view my source code athttp://moroccan-arts.co.uk/test-index-watermark.php
hope it'll help

P.S. I LOOOOVE this library but i think that a nice and active technical support is missing...

msealey

Posts: 8

Registered:
Aug 23, 2010

Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: » Different values for X, Y in Offset too, from redani
Thanks, redani.

I tried that: I put the trigger <DIV> at the bottom of the page - right before the closing </BODY>.

No luck :-(

At first I got the JavaScript code appearing where the tooltip should. So I moved the JavaScript code into the page's <Head>; now no tooltip displays at all.

Mastercafe
Juan Menendez http://www.mastercafe.com Integration jQuery framework on MBC info@mastercafe.com

Posts: 6

Registered:
Nov 14, 2009

» Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: Different values for X, Y in Offset too, from msealey
Are you using offset using the div section in bottom of body? If yes, remove it.
Normally the pixel movement in browser is because you are using position:absolute and relative before the div and affect the final position.
On direct div for body without offset run perfect.
Tell us your web with error.
You can see our sample code used at bottom in http://www.mastercafe.com/?zona=jquery&id=1355

msealey

Posts: 8

Registered:
Aug 23, 2010

Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: » Different values for X, Y in Offset too, from mbcinternet
Mastercafe,

Thanks.

No, my one offset parameter is only in the JavaScript - now at the top. <div id="trigger"> has nothing but the tooltip text.

Yes, I am using absolute and relative positioning in my classes.

No browser error. I added an id to the trigger class as in redani's cart example (thanks again!) and got it to display.

But it's still in different places for different browsers.

It's in development behind a firewall, so the only way I could put the code here is to upload the entire HTML page.

Mastercafe
Juan Menendez http://www.mastercafe.com Integration jQuery framework on MBC info@mastercafe.com

Posts: 6

Registered:
Nov 14, 2009

» Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: Different values for X, Y in Offset too, from msealey
Normally is better to put the DIV section and the Script at bottom of /body.
We normally check 78 browser version on each new development, and the big problem always is the render application (Gecko, Webkit, Trident, Presto).
On new Safari 5 and Chrome 5, obtain identical position Windows/Mac.
Try to send me the html code that you have to check on my trialweb. Use my mail juan@mastercafe.com

msealey

Posts: 8

Registered:
Aug 23, 2010

» » Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: » Different values for X, Y in Offset too, from mbcinternet
Juan,

Thanks. How very kind of you!

Have just sent a zip to that address.

You might want to remove it from the forum now - in case of spammers.

Thanks again :-)

redani

Posts: 39

Registered:
Aug 10, 2009

» Different values for X, Y in Offset too

Posted: Sep 9, 2010

Reply to: Different values for X, Y in Offset too, from msealey
you have a link?
i'm not an expert, i myself suffered so much to get it work but i'll try to help you ;)

Lwangaman

Posts: 1

Registered:
May 7, 2010

I can"t fix it on jquery ui buttons...

Posted: Oct 22, 2010

Reply to: FIXED, from tr309
I also am having problems with the vertical position of the tooltip. I tried putting a div with "id=tooltip" at the very bottom of the page as suggested, I put it last thing before the closing body tag. In my jquery code I select that as the div to use for the tooltip. If I put a vertical offset of -10 it shows just fine in Chrome, but the vertical offset doesn't seem to affect it in Firefox. No matter how much I change the offset the tooltip always shows far too low actually covering the trigger element in firefox, and a little bit high up in IE. The funny thing is it works fine in all browsers on two of the trigger elements. All of the other trigger elements are jquery ui buttons, and I can't in fact use the title of the actual button elements, I have to use the title of their labels; I wonder if the ui theming conflicts with the tools tooltip theming...
The page that this is happening on ishttp://consultapg33.altervista.org

JAVASCRIPT
...
$(".jqtooltip").tooltip({
effect: 'bouncy',
offset: [-10, 0],
tip: '#tooltip'
});

HTML:
...
<div id="tooltip"></div>
</body>

Mastercafe
Juan Menendez http://www.mastercafe.com Integration jQuery framework on MBC info@mastercafe.com

Posts: 6

Registered:
Nov 14, 2009

Position tooltip

Posted: Oct 22, 2010

Reply to: I can"t fix it on jquery ui buttons..., from Lwangaman
I think the problem is positioning the tooltip element. You use over div, and Chrome haven't problem to slide under top, so firefox use position 0 to put the element.
Try to use bottom tooltip on some head elements.

widr

Posts: 1

Registered:
Oct 26, 2010

» Position tooltip

Posted: Oct 26, 2010

Reply to: Position tooltip, from mbcinternet
Positioning the tooltip just before the </body> doesn't always work either. (It didn't work for me.)

I am using several nested div's, and I just tried a few places where I could put the tooltip(s), and found a working one by trial and error. Works perfect now.

•