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+ br/)
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:
div id=mymap style=overflow: hidden; height:300; width:300;
img class=map style=z-index: 10; /
img class=cross style=z-index: 100; /
/div
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: div id=mymap style=overflow: hidden; height:300; width:300; img class=map style=z-index: 10; / img class=cross style=z-index: 100; / /div 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/
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+ br/)
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:
div id=mymap style=overflow: hidden; height:300; width:300;
img class=map style=z-index: 10; /
img class=cross style=z-index: 100; /
/div
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/
