Re: [jQuery] image position question, take 2
Jake,
Sorry, I have commented out the console.debug() messages. I will convert
the code over to $.log() when I get a chance.
I'm using the console.debug() in FF2 and firebug 1.0b9
-Steve
Ⓙⓐⓚⓔ wrote:
> your console.debug("button: action:"+ e.data.action +"
> check_dirty:"+check_dirty);
>
> stops my firefox in it's tracks! I use
> jQuery.fn.debug = function(message) {
> return this.log('debug:' + (message || '')
> +"[").each(function(){jQuery.log(this);}).log("]");
> }
> jQuery.fn.log = jQuery.log = function(message) {
> if (!message) message = 'UNDEFINED'
> if (typeof message == "object") message = jsO(message)
> if(window.console && window.console.log) //safari
> window.console.log(message)
> else if(window.console && window.console.debug) //firebug
> window.console.debug(message)
> else
> jQuery("body").prepend(message+ "")
> return this
> }
>
>
> and it works for any browser (especially firefox + firebug!
>
> $log(whatever)
>
> On 1/22/07, Stephen Woodbridge <[EMAIL PROTECTED]> wrote:
>> Stephen Woodbridge wrote:
>>> Hi all,
>>>
>>> I know there has got to be an easy way to do thing but I'm having
>>> trouble figuring it out.
>>>
>>> I have a div that has an image in it and this image is positioned
>>> relative to the div based on what I want to look at and this works great
>>> so far.
>>>
>>> Now I want to overlay another transparent image over the first image. I
>>> know where the second image should be positioned relative the the 1st
>>> image. I can't figure out how to set top and left of the 2nd image to
>>> position it over the first. I know I need z-index set higher, but the
>>> positioning thing I get it to work. I started with:
>>>
>>>
>>>
>>>
>>>
>>>
>>> I then set the position of the image with jQuery. But this structure
>>> seem problematic as the 2nd image is positioned relative to the 1st
>>> image and not relative to its parent.
>>>
>> OK, so take 2 on this was to use the dimension plugin and get the offset
>> of div#mymap and to set the images "position: absolute" and to calculate
>> the top and left of the two images to position them absolute. This works
>> great for positioning, but the large map image is no longer honoring its
>> parent's div "overflow: hidden" attribute.
>>
>> It late and I'm going cross-eyed looking at this. I'm hoping some has a
>> suggestion.
>>
>> Here is a link (ONLY WORKS IN FIREFOX ATM):
>>
>> http://imaptools.com/sm/
>>
>> click "GO"
>>
>> it will load a map, the map should be clipped by the 300x300 div #imwin
>> which is set to "overflow: hidden"
>>
>> I'm guessing this is because overflow:hidden on works when elements are
>> layout in a flow and absolute must take them out of the flow.
>>
>> -Steve
>>
>> ___
>> jQuery mailing list
>> discuss@jquery.com
>> http://jquery.com/discuss/
>>
>
>
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] image position question
Stephen Woodbridge schreef: > > > > > > > > in css to position one image on top of another you best use absolute positioning but if you want to position it only to its parent element you have to set it to relative. the default static position doesn't cascade child element positioning. Now you can use jQuery to change the z-index to make a roll-over image. -- David Duymelinck [EMAIL PROTECTED] ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] image position question, take 2
your console.debug("button: action:"+ e.data.action +"
check_dirty:"+check_dirty);
stops my firefox in it's tracks! I use
jQuery.fn.debug = function(message) {
return this.log('debug:' + (message || '')
+"[").each(function(){jQuery.log(this);}).log("]");
}
jQuery.fn.log = jQuery.log = function(message) {
if (!message) message = 'UNDEFINED'
if (typeof message == "object") message = jsO(message)
if(window.console && window.console.log) //safari
window.console.log(message)
else if(window.console && window.console.debug) //firebug
window.console.debug(message)
else
jQuery("body").prepend(message+ "")
return this
}
and it works for any browser (especially firefox + firebug!
$log(whatever)
On 1/22/07, Stephen Woodbridge <[EMAIL PROTECTED]> wrote:
> Stephen Woodbridge wrote:
> > Hi all,
> >
> > I know there has got to be an easy way to do thing but I'm having
> > trouble figuring it out.
> >
> > I have a div that has an image in it and this image is positioned
> > relative to the div based on what I want to look at and this works great
> > so far.
> >
> > Now I want to overlay another transparent image over the first image. I
> > know where the second image should be positioned relative the the 1st
> > image. I can't figure out how to set top and left of the 2nd image to
> > position it over the first. I know I need z-index set higher, but the
> > positioning thing I get it to work. I started with:
> >
> >
> >
> >
> >
> >
> > I then set the position of the image with jQuery. But this structure
> > seem problematic as the 2nd image is positioned relative to the 1st
> > image and not relative to its parent.
> >
>
> OK, so take 2 on this was to use the dimension plugin and get the offset
> of div#mymap and to set the images "position: absolute" and to calculate
> the top and left of the two images to position them absolute. This works
> great for positioning, but the large map image is no longer honoring its
> parent's div "overflow: hidden" attribute.
>
> It late and I'm going cross-eyed looking at this. I'm hoping some has a
> suggestion.
>
> Here is a link (ONLY WORKS IN FIREFOX ATM):
>
> http://imaptools.com/sm/
>
> click "GO"
>
> it will load a map, the map should be clipped by the 300x300 div #imwin
> which is set to "overflow: hidden"
>
> I'm guessing this is because overflow:hidden on works when elements are
> layout in a flow and absolute must take them out of the flow.
>
> -Steve
>
> ___
> jQuery mailing list
> discuss@jquery.com
> http://jquery.com/discuss/
>
--
Ⓙⓐⓚⓔ - יעקב ʝǡǩȩ ᎫᎪᏦᎬ
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] image position question, take 2
Stephen Woodbridge wrote: > Hi all, > > I know there has got to be an easy way to do thing but I'm having > trouble figuring it out. > > I have a div that has an image in it and this image is positioned > relative to the div based on what I want to look at and this works great > so far. > > Now I want to overlay another transparent image over the first image. I > know where the second image should be positioned relative the the 1st > image. I can't figure out how to set top and left of the 2nd image to > position it over the first. I know I need z-index set higher, but the > positioning thing I get it to work. I started with: > > > > > > > I then set the position of the image with jQuery. But this structure > seem problematic as the 2nd image is positioned relative to the 1st > image and not relative to its parent. > OK, so take 2 on this was to use the dimension plugin and get the offset of div#mymap and to set the images "position: absolute" and to calculate the top and left of the two images to position them absolute. This works great for positioning, but the large map image is no longer honoring its parent's div "overflow: hidden" attribute. It late and I'm going cross-eyed looking at this. I'm hoping some has a suggestion. Here is a link (ONLY WORKS IN FIREFOX ATM): http://imaptools.com/sm/ click "GO" it will load a map, the map should be clipped by the 300x300 div #imwin which is set to "overflow: hidden" I'm guessing this is because overflow:hidden on works when elements are layout in a flow and absolute must take them out of the flow. -Steve ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
[jQuery] image position question
Hi all, I know there has got to be an easy way to do thing but I'm having trouble figuring it out. I have a div that has an image in it and this image is positioned relative to the div based on what I want to look at and this works great so far. Now I want to overlay another transparent image over the first image. I know where the second image should be positioned relative the the 1st image. I can't figure out how to set top and left of the 2nd image to position it over the first. I know I need z-index set higher, but the positioning thing I get it to work. I started with: I then set the position of the image with jQuery. But this structure seem problematic as the 2nd image is positioned relative to the 1st image and not relative to its parent. -Steve ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
