jQuery is supposed to briefly "show" the element to get its height/ width, then hide it again, this shouldn't be happening. Is your page valid xhtml? Couldn't you set the height and width inline attributes for the image?
- ricardo On Oct 23, 1:51 pm, diego <[EMAIL PROTECTED]> wrote: > I've done it...i don't use display:none , instead i use > visibility:hidden hideing the elements by js, works fine in all > browser... > > http://www.pirolab.it/piro_09/index2.html > > tnx again > > Diego > > On 23 Ott, 16:46, diego <[EMAIL PROTECTED]> wrote: > > > weidc i found the bug, at the elements with css 'display:none' IE > > gives width and height = 0, that's why i have in return 0-0, i think > > i'll work on it, trying to overcome this IE bug.. > > > Anyway thank you very much for support.. > > > Diego > > > On 23 Ott, 16:16, weidc <[EMAIL PROTECTED]> wrote: > > > > oh my god this sucks. kind of frustrating huh? > > > i'll keep on thinking about it. > > > > -weidc > > > > On 23 Okt., 15:56, diego <[EMAIL PROTECTED]> wrote: > > > > > Hi weidc, look at this..i've changed the .attr : > > > > > var litebox = $(this).attr('rel'); > > > > var altezza = $('#'+litebox+'>img.lite').attr('alt'); > > > > > and the html > > > > > <span class="thumbs_big" id="img1"> > > > > <img src="images/diegovalobra_b.jpg" title="900" alt="585" > > > > class="lite"/> > > > > <span class="thumbs_close" title="chiudi"><img src="css3/close.png" > > > > alt="prova" width="30" height="30" /></span> > > > > </span> > > > > > and it works in ie6/7 , i really don't understand.. > > > > >http://www.pirolab.it/piro_09/index2.html > > > > > On 23 Ott, 15:23, weidc <[EMAIL PROTECTED]> wrote: > > > > > > mh ye i see. > > > > > can't even change the attr in ie itself 'cause it always gets 0 again. > > > > > > maybe it doesn't like that > in $('#'+litebox+'>img.lite'). > > > > > atm i don't see a mistake in your script. > > > > > > -weidc > > > > > > On 23 Okt., 14:27, diego <[EMAIL PROTECTED]> wrote: > > > > > > > The problem is that the my elements are 'display:none' that's why > > > > > > if i > > > > > > try your code the alert returns 0-0, > > > > > > i need to use .attr, height and width.. > > > > > > > Diego > > > > > > > On 23 Ott, 14:08, diego <[EMAIL PROTECTED]> wrote: > > > > > > > > here an exemplehttp://www.pirolab.it/piro_09/index2.html > > > > > > > > the first three thumbs of the first box > > > > > > > > diego > > > > > > > > On 23 Ott, 14:00, diego <[EMAIL PROTECTED]> wrote: > > > > > > > > > Hi all, I'm building a gallery, and so far it works in every > > > > > > > > browser > > > > > > > > except Internet Explorer, > > > > > > > > The problem is that IE (burns to hell) doesn't read these > > > > > > > > variables > > > > > > > > > var height = $('#'+litebox+'>img.lite').attr('height'); > > > > > > > > var width = $('#'+litebox+'>img.lite').attr('width'); > > > > > > > > > the alert (alert(litebox+'-'+height + '-'+width );) returns > > > > > > > > img1-0-0 > > > > > > > > > and i really don't know why.... > > > > > > > > I tried to change the attributes height and width, in title > > > > > > > > and alt, > > > > > > > > giving the dimensions to the image in that way , and it works, > > > > > > > > but I > > > > > > > > cannot use title and alt to assign dimensions. > > > > > > > > I just want to understand why it does not work.. > > > > > > > > Below a part of the js code: > > > > > > > > > $('.img_in li a ').click(function () { > > > > > > > > > > > > > > > > $('.bg_thumbs').show().css({'opacity':'0','z- > > > > > > > > index':'999'}).fadeTo(200,0.4) > > > > > > > > $('.thumbs_big ').css({ > > > > > > > > > > > > > > > > 'background-color':'#000', > > > > > > > > > > > > > > > > 'background-image':'url(css3/ajax-loader.gif)', > > > > > > > > > > > > > > > > 'background-repeat':'no-repeat', > > > > > > > > > > > > > > > > 'background-position':'center'}) > > > > > > > > > var litebox = > > > > > > > > $(this).attr('rel'); > > > > > > > > var height = > > > > > > > > $('#'+litebox > > > > > > > > +'>img.lite').attr('height'); > > > > > > > > var width = > > > > > > > > $('#'+litebox > > > > > > > > +'>img.lite').attr('width'); > > > > > > > > > > > > > > > > $('#'+litebox).show().css('opacity',0).animate({ > > > > > > > > borderWidth : '4px', > > > > > > > > top :'50%', > > > > > > > > height : (height ) + > > > > > > > > 'px' , > > > > > > > > width : (width ) + 'px' > > > > > > > > , > > > > > > > > marginLeft : '-' > > > > > > > > +((width )/2) +'px', > > > > > > > > marginTop : '-' > > > > > > > > +((height )/2) +'px', > > > > > > > > opacity : 1 > > > > > > > > },600) > > > > > > > > > > > > > > > > alert(litebox+'-'+height + '-'+width ); > > > > > > > > > > > > > > > > $('#'+litebox).queue(function(){ > > > > > > > > $('.thumbs_big > > > > > > > > img').css({'opacity':'0' ,'display' : > > > > > > > > 'block'}).fadeTo(300,1) > > > > > > > > $('.thumbs_big > > > > > > > > ').css('background','#000') > > > > > > > > $('#'+litebox).dequeue() > > > > > > > > }); > > > > > > > > return false; > > > > > > > > > }); > > > > > > > > and here a part of html code: > > > > > > > > > <li id="img_1" title="thumb_1"> > > > > > > > > <a href="#" rel="img1"><img src="images/diegovalobra.jpg" > > > > > > > > alt="prova" > > > > > > > > width="200" height="139" id="thumb_1"/></a> > > > > > > > > </li> > > > > > > > > > <span class="thumbs_big" id="img1"> > > > > > > > > <img src="images/diegovalobra_b.jpg" alt="prova" width="900" > > > > > > > > height="585" class="lite"/> > > > > > > > > <span class="thumbs_close" title="chiudi"><img > > > > > > > > src="css3/close.png" > > > > > > > > alt="prova" width="30" height="30" /></span> > > > > > > > > </span> > > > > > > > > > I've tested the code in firefox, opera, google chrome, > > > > > > > > safari(pc) and > > > > > > > > works fine... > > > > > > > > IE sucks > > > > > > > > > every kind of help is appreciated, thanks to all :) > > > > > > > > > Diego
