Solved

Changing an image in a cell on every reload  of the page

Posted on 2001-06-19
20
220 Views
Last Modified: 2011-10-03
I have a web page in which a cell has an image.Now what I want is on every reload of the page the image has to change.(This is not a background image for the page.)

In all I have three images.For example img1,img2,img3
First time the page loads, img1 should be displayed in the cell.The next time the page is reloaded , img2 and the third time img3 should be displayed. this sequence has to continue.

Also if I add a hotspot in the images, will the hotspots function when the images are reloaded?
0
Comment
Question by:aditi_kulkarni
  • 6
  • 3
  • 3
  • +6
20 Comments
 
LVL 1

Expert Comment

by:Ernest022699
ID: 6209304
Just for clarification: Do you mean every time the Page is LOADED (viewed by a random person) or RELOADED (viewed again by the same individual?

Hint: Can you use cookies?

The hotspot will be in the location specified.  You may not want the same location for all the images, meaning you may want to specify different hotspots for different images.
0
 

Author Comment

by:aditi_kulkarni
ID: 6209461
The image has to be refreshed everytime the page is loaded (viewed by a random person) as well as when it is reloaded (viewed again by the same individual).

Cookies are not to be used.
Yes different hotspots will be specified for different images.
0
 
LVL 19

Expert Comment

by:webwoman
ID: 6210104
Can this be a random change?
0
 

Author Comment

by:aditi_kulkarni
ID: 6210141
No.The change cannot be random.
The images have to change in the order given i.e first image1 then image2 then image3 and then again image1 and so on.
0
 
LVL 2

Expert Comment

by:kristofer
ID: 6210802
I'm not sure this is possible in an easy way. The way you would normally make the page "remember" which pic it showed last, is by saving a constant like "1" for last picture shown was picture 1, in a file. However, you can't save to files with HTML (I think).

Not much help but that's what I think...
0
 
LVL 1

Expert Comment

by:paintbrush
ID: 6210826
One example of what you are looking for is at: http://www.panam.edu/2000/
If you click reload (or refesh) on this page a different image comes up each time.  The way they are doing this is with some sort of server side programming specifically for this page (could be asp code)  that for each request for the page a counter is incremented and that counter is used in the jpg image name (example: 1.jpg or 2.jpg or 3.jpg etc.)  If they have 10 different images then it would increment 1 - 10 and then start over again.

Another way to do this is with a cgi program that outputs image data.  Many counter programs are written like this and is a way to get different graphical fonts displayed for the counter.  An example of calling a counter program in the html would be:  
<img src="http://website.org?htmlpage1" border=0 alt="hit counter">
Where htmlpage1 represents the page that is being kept count of.

A real-world example of a counter can be seen at  http://www.web-stat.com/.  Their html counter code on their home page is:
<img src="http://www.web-stat.com/fastcount.cgi?Atest1,NoJavaScript" border=0 alt="Web-Stat hit counter">

In this particular case when you click reload the counter does not always increment because the program is smart enough to detect that your computer is the same computer that loaded their page last time. (This is a safety feature against "Counter Attack" to prevent people or programs from running up your counter and giving you a false impression of site visits.)

You may be able to find a cgi program that works somewhat like these counter programs only instead of outputting a graphical number it outputs a different image depending on an internal counter where it rotates through a list of images and then starts over.

The problem with either of these methods is that with a popular site with many people accessing your page at the same time, clicking reload may not show you the 3 images in the order you want or even start the user at the first image.

There may be a way using javascript where the user could click on the image or a button beside the image to see the images in order.

To automatically show 3 images in order (no clicking required) would be to create an animated gif that would automatically roll through the images.  See http://trainingpost.uthct.edu for an example.

0
 
LVL 18

Expert Comment

by:bruno
ID: 6211303
>>The images have to change in the order given i.e first image1 then image2 then image3 and then again
image1 and so on.


the images have to go in order for each person?  in other words, if i hit the page, i'll see image 1.  then if YOU hit the page, you'll see image 2, then if i hit the page again i'll see image 3.

OR.

i hit the page, i see image 1.  you hit the page, you see image 1. i hit the page i see image 2...etc.

if you prefer to do it the second way, you could use user sessions to remember what image the user was on, but sessions time out.  if you really want to remember for a long time, say i hit the page (image 1), then come back a week later, and you want the next image to come up (image 2), you might want to set a cookie every time the page is loaded with the image number, so when the page is loaded it can check the cookie, grab the image number, increment it by 1, then show the correct image, and set another cookie with the new image number.


Why are you opposed to using cookies?


BRUNO
0
 

Author Comment

by:aditi_kulkarni
ID: 6212935
Bruno,
The images have to go in order. No matter who hits the page and in what sequence.If you hit it and suppose image1 shows up.Next if I hit it , it shows up image 2. Then if a third person or if you hit it , it shows up image 3.Then again image1 and so on.

Okay lets see how this is done with cookies.
0
 
LVL 18

Expert Comment

by:bruno
ID: 6214958
that would have to be done server side, no cookies involved.

if you wanted the second version of what i posted cookies would be useful.  

you could use a DB to do this.  have a table, with one field.  

NMBR
1

when the page gets hit, hit the DB, grab the number, show the image the number corresponds to, and increment the number by 1.

the next person who hits the page will get image number 2, and will increment the number to 3.

when someone hits the page and the number = 3, reset the number to 1, and start the loop over again.


BRUNO
0
 
LVL 18

Accepted Solution

by:
bruno earned 50 total points
ID: 6214963
not sure why they have to come up in order, no one will ever know.  if i see image 1, and you see image 2, and i see image 3, i'll never know there is an order to the images.  

a random function would be much easier, i think there has been some links posted to a couple of examples.

another example at :  http://www.tirtal.com/

everytime the page is reloaded you get a new image.


BRUNO
0
Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

 
LVL 1

Expert Comment

by:Ernest022699
ID: 6216675
brunobear is right.  Simple for CGI using Perl, etc.  No need for cookies at all, since it would be OK for random_user1 to see the same image random_user14 saw.
0
 

Expert Comment

by:teacher_mod
ID: 6374556
This question has been abandoned. Would the experts please indicate how
this should be closed out. Is there a comment which should be accepted?
Should the points be split? Should it be reduced to zero points and PAQed?
should it be deleted?  In the absence of direction, the default will be
for me to delete.

TIA for helping to clean up the old questions.

teacher_mod
Community Support Moderator
Experts-Exchange
teacher_mod@experts-exchange.com


0
 
LVL 1

Expert Comment

by:Ernest022699
ID: 6374956
teacher_mod: IMHO paintbrush and brunobear contributed equally.  Please PAQ it up.  NO points to me, please.
0
 
LVL 18

Expert Comment

by:bruno
ID: 6375861
*shrug*  that sounds fine to me.  wish i knew if anything we said was helpful.

BRUNO
0
 
LVL 1

Expert Comment

by:paintbrush
ID: 6380112
ok by me.  - paintbrush
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6520396
It is time to clean this abandoned question up.  

I am putting it on a clean up list for CS.

<recommendation>
split paintbrush/brunobear

</recommendation>

If anyone participating in the Q disagrees with the recommendation,
please leave a comment for the mods.

Cd&
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6523049
aditi_kulkarni,

That is about as childish as you can get.  You undervalue a difficult question by only offering 50 points.  Then when you cannot have the perfect solution you sulk for 4 months leaving the question unmanaged, then you decide to punish an expert who was trying to help you, by giving them a direspectful grade.

On top of it you are not even professional enough to post a comment explaining your actions.

I suggest you visit the help desk and spend some time looking at the site guidelines and other materials to help you understand how a professional site works.

Cd&
0
 
LVL 18

Expert Comment

by:bruno
ID: 6523922
a "C"...  :-(  was i that bad?

oh well...
0
 
LVL 1

Expert Comment

by:kodiakbear
ID: 6543523
Changed the grade to an A
paintbrush see your question for your points
0
 
LVL 18

Expert Comment

by:bruno
ID: 6559822
thanks kodiak...unneeded, but thanks anyways.
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now