[jQuery] Re: SOT: execute JS before a specific image loads
You won't be able to intercept the image before it is loaded but you can block it from being rendered. Remember that JavaScript relies on the DOM. The DOM isn't fully-defined for the page, until all of it has loaded. But you can hide it by setting its visibilitiy to hidden, and keep the browser from allocating real estate for it by setting display to block. (Default is inline). Looking at the code you included, I don't believe there is a statistic of interest that you cannot collect when the page you've served, is requested. (That is, the only info the browser will have that is new, it the location of what it renders after receiving what the server sends.) For example, the location of everything won't be available to JavaScript until after what it will render, has been rendered. By the way, I'm not pretending I know your business. What I meant by stat of interest is that whatever you collect, after delivering the image, that you cannot collect when the request for the page is made, is something that can be assumed as consistent, from request to request, even from the same user. Correct me if I'm incorrect about this (please). --John Crout On Wed, May 20, 2009 at 9:51 AM, Andy Matthews amatth...@dealerskins.comwrote: Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? Andy Matthews Senior Web Developer www.dealerskins.com P Please consider the environment before printing this e-mail. Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at aw...@dealerskins.com.
[jQuery] Re: SOT: execute JS before a specific image loads
John... The original intent was to render an img tag to the page which would load in a subset of my desired data, specifically that which can easily be gotten via interpretation of the user agent string and other items. That subset would get added to the src of the image as URL key/value pairs. Then, when jQuery was available, I'd replace the src of the image tag with additional information, which can only be gotten via JS (resolution, bandwidth, flash player, etc). In my testing I was never able to get this working. However, after doing some googling, I found the lazy load plugin. Doesn't that do pretty much what I'm looking for? Namely prevent the loading of an image until it's scrolled into the visible window space? andy _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of John Crout Sent: Wednesday, May 20, 2009 6:08 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads You won't be able to intercept the image before it is loaded but you can block it from being rendered. Remember that JavaScript relies on the DOM. The DOM isn't fully-defined for the page, until all of it has loaded. But you can hide it by setting its visibilitiy to hidden, and keep the browser from allocating real estate for it by setting display to block. (Default is inline). Looking at the code you included, I don't believe there is a statistic of interest that you cannot collect when the page you've served, is requested. (That is, the only info the browser will have that is new, it the location of what it renders after receiving what the server sends.) For example, the location of everything won't be available to JavaScript until after what it will render, has been rendered. By the way, I'm not pretending I know your business. What I meant by stat of interest is that whatever you collect, after delivering the image, that you cannot collect when the request for the page is made, is something that can be assumed as consistent, from request to request, even from the same user. Correct me if I'm incorrect about this (please). --John Crout On Wed, May 20, 2009 at 9:51 AM, Andy Matthews amatth...@dealerskins.com wrote: Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? Andy Matthews Senior Web Developer www.dealerskins.com P Please consider the environment before printing this e-mail. Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at aw...@dealerskins.com.
[jQuery] Re: SOT: execute JS before a specific image loads
Hmm... This is weird... I posted a reply at 3PM yesterday and it doesn't look like it made it onto the group. (You didn't see it, did you?) So here goes again, with some additional notes this time... The problem is really much easier than all this. There's no reason to use a lazy load plugin, and no reason to even use jQuery. Simply use a noscript tag for the non-JavaScript case, and a script tag with document.write() for the JavaScript case: noscript img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / /noscript script type=text/javascript document.write( 'img id=statsImg src=stats.cfm?somevar=someval', /* your extra stuff here, e.g.: */ 'anothervar=anotherval', ' width=1 height=1 /' ); /script Or, you can use jQuery for the dynamic image if you like. But don't try to modify the IMG from the noscript section - it won't exist. Instead, add your own IMG element with jQuery instead of document.write. -Mike _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Andy Matthews Sent: Thursday, May 21, 2009 7:08 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads John... The original intent was to render an img tag to the page which would load in a subset of my desired data, specifically that which can easily be gotten via interpretation of the user agent string and other items. That subset would get added to the src of the image as URL key/value pairs. Then, when jQuery was available, I'd replace the src of the image tag with additional information, which can only be gotten via JS (resolution, bandwidth, flash player, etc). In my testing I was never able to get this working. However, after doing some googling, I found the lazy load plugin. Doesn't that do pretty much what I'm looking for? Namely prevent the loading of an image until it's scrolled into the visible window space? andy _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of John Crout Sent: Wednesday, May 20, 2009 6:08 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads You won't be able to intercept the image before it is loaded but you can block it from being rendered. Remember that JavaScript relies on the DOM. The DOM isn't fully-defined for the page, until all of it has loaded. But you can hide it by setting its visibilitiy to hidden, and keep the browser from allocating real estate for it by setting display to block. (Default is inline). Looking at the code you included, I don't believe there is a statistic of interest that you cannot collect when the page you've served, is requested. (That is, the only info the browser will have that is new, it the location of what it renders after receiving what the server sends.) For example, the location of everything won't be available to JavaScript until after what it will render, has been rendered. By the way, I'm not pretending I know your business. What I meant by stat of interest is that whatever you collect, after delivering the image, that you cannot collect when the request for the page is made, is something that can be assumed as consistent, from request to request, even from the same user. Correct me if I'm incorrect about this (please). --John Crout On Wed, May 20, 2009 at 9:51 AM, Andy Matthews amatth...@dealerskins.com wrote: Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? Andy Matthews Senior Web Developer www.dealerskins.com P Please consider the environment before printing this e-mail. Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at aw...@dealerskins.com.
[jQuery] Re: SOT: execute JS before a specific image loads
I did not see your response Michael...bummer. It might have changed our approach. Regardless we've got the desired functionality in place already. Thanks for your time. andy _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Michael Geary Sent: Thursday, May 21, 2009 12:32 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads Hmm... This is weird... I posted a reply at 3PM yesterday and it doesn't look like it made it onto the group. (You didn't see it, did you?) So here goes again, with some additional notes this time... The problem is really much easier than all this. There's no reason to use a lazy load plugin, and no reason to even use jQuery. Simply use a noscript tag for the non-JavaScript case, and a script tag with document.write() for the JavaScript case: noscript img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / /noscript script type=text/javascript document.write( 'img id=statsImg src=stats.cfm?somevar=someval', /* your extra stuff here, e.g.: */ 'anothervar=anotherval', ' width=1 height=1 /' ); /script Or, you can use jQuery for the dynamic image if you like. But don't try to modify the IMG from the noscript section - it won't exist. Instead, add your own IMG element with jQuery instead of document.write. -Mike _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Andy Matthews Sent: Thursday, May 21, 2009 7:08 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads John... The original intent was to render an img tag to the page which would load in a subset of my desired data, specifically that which can easily be gotten via interpretation of the user agent string and other items. That subset would get added to the src of the image as URL key/value pairs. Then, when jQuery was available, I'd replace the src of the image tag with additional information, which can only be gotten via JS (resolution, bandwidth, flash player, etc). In my testing I was never able to get this working. However, after doing some googling, I found the lazy load plugin. Doesn't that do pretty much what I'm looking for? Namely prevent the loading of an image until it's scrolled into the visible window space? andy _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of John Crout Sent: Wednesday, May 20, 2009 6:08 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads You won't be able to intercept the image before it is loaded but you can block it from being rendered. Remember that JavaScript relies on the DOM. The DOM isn't fully-defined for the page, until all of it has loaded. But you can hide it by setting its visibilitiy to hidden, and keep the browser from allocating real estate for it by setting display to block. (Default is inline). Looking at the code you included, I don't believe there is a statistic of interest that you cannot collect when the page you've served, is requested. (That is, the only info the browser will have that is new, it the location of what it renders after receiving what the server sends.) For example, the location of everything won't be available to JavaScript until after what it will render, has been rendered. By the way, I'm not pretending I know your business. What I meant by stat of interest is that whatever you collect, after delivering the image, that you cannot collect when the request for the page is made, is something that can be assumed as consistent, from request to request, even from the same user. Correct me if I'm incorrect about this (please). --John Crout On Wed, May 20, 2009 at 9:51 AM, Andy Matthews amatth...@dealerskins.com wrote: Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? Andy Matthews Senior Web Developer www.dealerskins.com P Please consider the environment before printing this e-mail. Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at aw...@dealerskins.com.
[jQuery] Re: SOT: execute JS before a specific image loads
Andy, Dunno if you can do thatcurious though, could you just do an ajax call that gives you the extra stuff? It won't fire if they don't have javascript present, so it would do pretty much the same thing. -- Josh _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Andy Matthews Sent: Wednesday, May 20, 2009 8:52 AM To: jquery-en@googlegroups.com Subject: [jQuery] SOT: execute JS before a specific image loads Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? Andy Matthews Senior Web Developer OLE Object: Picture (Metafile) www.dealerskins.com P Please consider the environment before printing this e-mail. Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at aw...@dealerskins.com. attachment: winmail.dat
[jQuery] Re: SOT: execute JS before a specific image loads
I could, and that's the way we're approaching this. I'd rather do it all at once, rather than have two db inserts. No biggie. _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Josh Nathanson Sent: Wednesday, May 20, 2009 12:51 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: SOT: execute JS before a specific image loads Andy, Dunno if you can do thatcurious though, could you just do an ajax call that gives you the extra stuff? It won't fire if they don't have javascript present, so it would do pretty much the same thing. -- Josh _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Andy Matthews Sent: Wednesday, May 20, 2009 8:52 AM To: jquery-en@googlegroups.com Subject: [jQuery] SOT: execute JS before a specific image loads Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? Andy Matthews Senior Web Developer OLE Object: Picture (Metafile) www.dealerskins.com P Please consider the environment before printing this e-mail. Total customer satisfaction is my number 1 priority! If you are not completely satisfied with the service I have provided, please let me know right away so I can correct the problem, or notify my manager Aaron West at aw...@dealerskins.com. attachment: winmail.dat
[jQuery] Re: SOT: execute JS before a specific image loads
Use a noscript tag for the non-JavaScript case, and a script tag with document.write() for the JavaScript case: noscript img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / /noscript script type=text/javascript document.write( 'img id=statsImg src=stats.cfm?somevar=someval', /* your extra stuff here, e.g.: */ 'anothervar=anotherval', ' width=1 height=1 /' ); /script -Mike _ From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On Behalf Of Andy Matthews Sent: Wednesday, May 20, 2009 8:52 AM To: jquery-en@googlegroups.com Subject: [jQuery] SOT: execute JS before a specific image loads Can I intercept the loading of an image BEFORE it loads? We're looking at using an img tag for inserting stats on our server. Here's what I'm considering... 1) Collect certain information server side, write an img to the document like so (note the URL vars): img id=statsImg src=stats.cfm?somevar=someval width=1 height=1 / 2) Using JS, intercept the load of this image BEFORE it takes place, and add things to the URL vars. This way, if JS is not present, you get the default stuff, but if JS is present, you get extra stuff. Anyone? attachment: winmail.dat
