|
|
 |
 |
 |
 |
Javascript / Client Side Development
|
 |
 |
 |
 |
 |
 |
 |
 |
how to refresh the page?
<img src=...Onlick = "if (!(this.temp>=640)) { this.temp=640; } if (this.width>=640) { xyz=this.width; this.width=this.temp; this.temp=xyz; }"> Inline script.... I got the above code from internet and it is used to change the width of the IMG element. This not only "changes" the width but also "refreshes" the page so that I can see the change in width. Function script... I moved above inline script to a JS file and it is as follows. Now, 'width' of the IMG element seem to change but display does not get refreshed; and if I add a window.alert( ); then I see screen refreshing function Show() { iImageWidth = 640; if(document.getElementById) //gecko(NN6) + IE 5+ { var obj = document.getElementById("IndividualImageID"); if (!(obj.LastWidth>=iImageWidth)) { 'window.alert( 'obj.LastWidth = ' + obj.LastWidth ); //Uncommenting this line would // display image with new width obj.LastWidth=iImageWidth; } if (obj.width>=iImageWidth) { 'window.alert( 'obj.LastWidth1 = ' + obj.LastWidth ); //Uncommenting this line would // display image with new width xyz=obj.width; obj.width=obj.LastWidth; obj.LastWidth=xyz; } } }
Please let me know how can I make this script refresh. Thanks Ramesh
asnowf @gmail.com wrote: > <img src=...Onlick = "if (!(this.temp>=640)) { this.temp=640; } if > (this.width>=640) { xyz=this.width; this.width=this.temp; > this.temp=xyz; }"> Hi, The above code is strange: onLick event? Does that handler fire when a client licks that image? Anyway, assuming onClick(): The above code stores the width of the image in a freshly made property named temp. If not set, it defaults to 640. If clicked again it switches back to original format. > Inline script.... > I got the above code from internet and it is used to change the width > of the IMG element. This not only "changes" the width but also > "refreshes" the page so that I can see the change in width.
As far as I can see, no refreshing is done. At least not in the above code. And refreshing the page would certainly result in a new page and thus in loosing the property named temp for that image. Same goes for every variable in JavaScript. They are all lost if the page is refreshed unless you take special precautions, like storing things in COOKIE or encoding stuff in GET, like: location='mypage.html?temp=640'; So refreshing is a bad idea, at least in the situation you described. Regards, Erwin Moller
Sorry for the typo, it should have been "OnClick". Yes, event gets fired and page does not get refreshed if I do not have a call to alert(). Here is the page that I was reffering to. In this page, 'clicking' on the image would shrink the image; and to see the shrunken image I had to add alert() call. http://www.asnowfall.com/Photo/pg4/{07745FF1-0437-48f1-9183-4C57A047CAFB}-6.html Thanks for responding Ramesh On May 23, 7:51 am, Erwin Moller
<since_humans_read_this_I_am_spammed_too_m @spamyourself.com> wrote: > asnowf @gmail.com wrote: > > <img src=...Onlick = "if (!(this.temp>=640)) { this.temp=640; } if > > (this.width>=640) { xyz=this.width; this.width=this.temp; > > this.temp=xyz; }"> > Hi, > The above code is strange: > onLick event? > Does that handler fire when a client licks that image? > Anyway, assuming onClick(): The above code stores the width of the image in > a freshly made property named temp. > If not set, it defaults to 640. If clicked again it switches back to > original format. > > Inline script.... > > I got the above code from internet and it is used to change the width > > of the IMG element. This not only "changes" the width but also > > "refreshes" the page so that I can see the change in width. > As far as I can see, no refreshing is done. At least not in the above code. > And refreshing the page would certainly result in a new page and thus in > loosing the property named temp for that image. > Same goes for every variable in JavaScript. They are all lost if the page is > refreshed unless you take special precautions, like storing things in > COOKIE or encoding stuff in GET, like: > location='mypage.html?temp=640'; > So refreshing is a bad idea, at least in the situation you described. > Regards, > Erwin Moller
Sorry for the typo, it should have been "OnClick". Yes, event gets fired and page does not get refreshed if I do not have a call to alert(). >Anyway, assuming onClick(): The above code stores the width of the image in >a freshly made property named temp. >If not set, it defaults to 640. If clicked again it switches back to >original format.
In am planning to read the width dynamically. >So refreshing is a bad idea, at least in the situation you described.
I do not know much about Java script and web technologies and based on my C++ experience, I agree there should be a way to maintain the 'state' but here I do not see that happenning. I do not know how the 'this.temp' works. Most confusing part is that the script called from HTML is able to refresh but the same script when stored inside JS file, is not able to refresh. I want the script to be in JS file because I would like to get the screen size dynamically; and I do not want the width to be hard coded to 640. I stole the idea of shriking the image from this site, in this site event handler is 'inline', means part of <IMG> tag or HTML file. http://www.tawbaware.com/forum2/viewtopic.php?t=4354 This is my implementation of the above in my site. In this page, 'clicking' on the image would shrink the image; and to see the shrunken image I had to add alert() call. http://www.asnowfall.com/Photo/pg4/{07745FF1-0437-48f1-9183-4C57A047CAFB}-6.html Without COOKIE or any sort of server support, is there a way to make this work? Thanks for responding Ramesh On May 23, 7:51 am, Erwin Moller
<since_humans_read_this_I_am_spammed_too_m @spamyourself.com> wrote: > asnowf @gmail.com wrote: > > <img src=...Onlick = "if (!(this.temp>=640)) { this.temp=640; } if > > (this.width>=640) { xyz=this.width; this.width=this.temp; > > this.temp=xyz; }"> > Hi, > The above code is strange: > onLick event? > Does that handler fire when a client licks that image? > Anyway, assuming onClick(): The above code stores the width of the image in > a freshly made property named temp. > If not set, it defaults to 640. If clicked again it switches back to > original format. > > Inline script.... > > I got the above code from internet and it is used to change the width > > of the IMG element. This not only "changes" the width but also > > "refreshes" the page so that I can see the change in width. > As far as I can see, no refreshing is done. At least not in the above code. > And refreshing the page would certainly result in a new page and thus in > loosing the property named temp for that image. > Same goes for every variable in JavaScript. They are all lost if the page is > refreshed unless you take special precautions, like storing things in > COOKIE or encoding stuff in GET, like: > location='mypage.html?temp=640'; > So refreshing is a bad idea, at least in the situation you described. > Regards, > Erwin Moller
I'm not sure what your problem in your code is. I just built and ran the following: --play.htm-- <html><head> <script src='play.js' language="JavaScript" type="text/javascript" ></ script> </head><body> <img src='winter.jpg' onclick='swapsize(this);' ></img> </body></html> --play.js-- function swapsize(el) { if (el.width==800) { el.width=400; el.height=300; } else { el.width=800; el.height=600; } }
Yes, it's simple. Point is, there is no 'refresh', no round trip to the server. All that happens is the image changes sizes. That is what you were looking for, right? J
|
 |
 |
 |
 |
|