Log in

View Full Version : Its kinda hard to explain.....



ModernRevolutions
02-10-2007, 02:26 PM
I went on a site once and it had a bunch of HTML tutorials and codes. and one of them was when you refresh the page the pic would change. She used it for affiliates pics. and everytime you refresh the page it would change to a different one. Does anybody have that code?

jscheuer1
02-10-2007, 02:41 PM
See:

http://www.dynamicdrive.com/forums/showthread.php?t=8136

I cannot vouch for the code given earlier in that thread for random images, it looked a little shaky to me but the sequential (robin) code I give later in that thread is fine. The random images thing (by Twey, in one of his weaker moments :) ) might be OK and if it is not, it can be easily fixed.

Twey
02-10-2007, 02:49 PM
Hmm? That's my standard random-set code, it's perfectly sane as far as I can see. What's wrong with it?

ModernRevolutions
02-10-2007, 02:54 PM
thanks so much :] but how can i make the random picture a different link as well as a different pic. like she has www.swimchick.net she has her affiliates button(pic) change when u refresh the page and the link changes with it. how would i do that?

jscheuer1
02-10-2007, 02:59 PM
Hmm? That's my standard random-set code, it's perfectly sane as far as I can see. What's wrong with it?

I had to look again. As far as I know, document.images as you have used it in that thread requires that the image tag's name attribute correspond, not its id. IE will use either but, I think most browsers require name. I could be wrong on that though.

//Edit:

I just checked and it doesn't seem to matter in FF or Opera but, I think at one time it did.

jscheuer1
02-10-2007, 03:13 PM
thanks so much :] but how can i make the random picture a different link as well as a different pic. like she has www.swimchick.net she has her affiliates button(pic) change when u refresh the page and the link changes with it. how would i do that?

You can make up a second array for the links:


//Set Your Images in the below Array:
var robin_im=['files/1_side.jpg', 'files/2_side.jpg', 'files/3_side.jpg', 'files/5_side.jpg', 'files/8_side.jpg']
//Set Your Links in the below Array:
var robin_lnk=['http://www.google.com', 'http://www.msn.com', 'http://www.yahoo.com', 'http://www.dynamicdrive.com', 'http://www.m-w.com']

//////////////// Stop Editing //////////////////

and add in code to use it here:


document.write('<a href="'+robin_lnk[num]+'" target="_blank"><img src="'+robin_im[num]+'" border="0"><\/a>');

Twey
02-10-2007, 03:54 PM
I just checked and it doesn't seem to matter in FF or Opera but, I think at one time it did.Not since IDs were introduced, I believe.
var robin_lnk=['href://www.google.com', 'href://www.msn.com', 'href://www.yahoo.com', 'href://www.dynamicdrive.com', 'href://www.m-w.com']Hmm? href://? That's an odd protocol :p

The equivalent adaption for my code would look something like this:
<a id="randomImage_link" href="http://www.google.com/">
<img id="randomImage" src="/images/file.png">
</a>

<script type="text/javascript">
var imgs = [
["/images/file.png", "http://www.google.com/"],
["images/myfile.jpg", "http://www.yahoo.com/"],
["ourfile.gif", "http://www.bbc.co.uk/"],
["http://www.mysite.com/theirfile.tiff", "http://www.dynamicdrive.com/"]
];

var cimg = imgs[Math.floor(Math.random() * imgs.length)];
document.images['randomImage'].src = cimg[0];
document.links['randomImage_link'].href = cimg[1];
</script>... where the properties in the original HTML tags are those to use for non-Javascript browsers.

jscheuer1
02-10-2007, 05:30 PM
The href in the array was a typo (I meant http there) and has been corrected in my post. I'm still not clear on when this id vs name thing with document.images changed. I'm thinking earlier NS/Mozilla browsers didn't make the switch as soon as you might think. Apparently, in modern browsers on the PC it isn't a problem. I don't know about Safari or others. It still would be being on the safe side to use name. That way even NS 4 could handle it.

I still am not wild about one thing in your otherwise fine looking code though, Twey, the exposed variables imgs and cimg.

Oh and you mean attributes, not properties here, right?


where the properties in the original HTML tags are those to use for non-Javascript browsers.

Twey
02-10-2007, 09:53 PM
I still am not wild about one thing in your otherwise fine looking code though, Twey, the exposed variables imgs and cimg.Hmm? Why? robin_im and robin_lnk are "exposed" in yours, aren't they? Or am I misunderstanding your definition of "exposed?"
Oh and you mean attributes, not properties here, right?Aye. :)
Apparently, in modern browsers on the PC it isn't a problem. I don't know about Safari or others. It still would be being on the safe side to use name. That way even NS 4 could handle it.I'm given to understand that name will soon be deprecated for images, since it serves no real purpose.

jscheuer1
02-10-2007, 10:31 PM
I've heard some talk about that deprecation of name with images but, I think it would be a mistake somewhat along the lines of unused yet reserved words in javascript. Removing flexibility is never that good of an idea in my opinion. However, it may happen.

By an exposed variable, I refer to a global variable. There are no global variables in my code. The one exposed object is the function itself. This is a new kick I am on but, I think it is a good one. There are so many scripts out there and so many folks using 10 or more on a page that the less that gets exposed in any given script, the better. My current pet peeve in this regard is garbage like a global:

var ie4=document.all;

If it means document.all, just use document.all! Or, if you must use shorthand because your fingers are falling off as you type, protect it within a/the function(s) that use it.

I know you are rarely, if ever, guilty of this sort of flagrant invitation to variable conflict Twey.

Some of the third party menus on DD use ie4= this and other DD scripts use ie4= that - both set globally. The two poor scripts just can't play together at all.

boxxertrumps
02-10-2007, 11:07 PM
<?php
function rand_img($imgset)
{
$full_string = file_get_contents($imgset);
if (isset($full_string)) {
$url_array = explode("|", $full_string);
$num = count($url_array)-1;
$choice = rand(0,$num);
echo "<img alt=\"Random Image\" src=\"$url_array[$choice]\" />";
} else {
echo "<b>File not found.</b>";}
};
?>

have a set of URLs seperated with | in a text file and call the rand_img(http://path.to.text/file.txt) function where you want the image to appear.

Twey
02-10-2007, 11:10 PM
Well that's an original reason not to use browser detection, I guess :p

You do have a point. Still, it's no huge problem to put the whole script in an anonymous function, if that's necessary:
(function() {
var imgs = [
["/images/file.png", "http://www.google.com/"],
["images/myfile.jpg", "http://www.yahoo.com/"],
["ourfile.gif", "http://www.bbc.co.uk/"],
["http://www.mysite.com/theirfile.tiff", "http://www.dynamicdrive.com/"]
];

var cimg = imgs[Math.floor(Math.random() * imgs.length)];
document.images['randomImage'].src = cimg[0];
document.links['randomImage_link'].href = cimg[1];
})();
Then there are no global variables at all :)

boxxertrumps
02-17-2007, 10:11 PM
I proclaim this thread: Revived.

new random image php code, actually.


<?
function rand_img($imgset) {
$full_string = file_get_contents($imgset);
$url_array = explode("|", $full_string);
$num = count($url_array)-1;
if ($_GET['rand'] != "") {
$choice = $_GET['rand'];
} else {
$choice = rand(0,$num);
};
$prev = $choice-1;
$next = $choice+1;
?>
<img alt="Random Image" src="<?php echo $url_array[$choice]; ?>" /><br />
<?php if ($choice != "0") {echo"<a href='?rand=". $prev ."'>Previos</a>";}; ?>

<input style="width:300px;" type="text" name="" value="http://your.domain.and/path/to/script/?rand=<?php echo $choice; ?>" />

<?php if ($choice != $num) {echo"<a href='?rand=". $next ."'>Next</a>";};
};
?>

same way to call the script...

Twey
02-17-2007, 10:49 PM
<?Since it's impossible to know whether the recipient has short tags enabled or not, always use the full <?php form when writing code to run on a server not one's own.
$full_string = file_get_contents($imgset);
$url_array = explode("|", $full_string);Surely it would be easier to separate the images by newlines and use file().
$num = count($url_array)-1;
if ($_GET['rand'] != "") {
$choice = $_GET['rand'];
} else {
$choice = rand(0,$num);
};
$prev = $choice-1;
$next = $choice+1;I'm sure this can be condensed... also, some lines could be blank (some editors automatically insert a blank line at the ends of files).
?>
<img alt="Random Image" src="<?php echo $url_array[$choice]; ?>" /><br />It's generally safer at the moment to assume the recipient will be using HTML.
<?php if ($choice != "0") {echo"<a href='?rand=". $prev ."'>Previos</a>";}; ?>It seems wasteful to deliberately convert a string to a number when we already know that the value to be compared is a number.
<input style="width:300px;" type="text" name="" value="http://your.domain.and/path/to/script/?rand=<?php echo $choice; ?>" />Specifying the width of an input element in pixels could cause trouble. ems would be better advised. Also, what's this textbox actually for?
<?php
function rand_img($imgset) {
$urls = file($imgset);
$len = count($urls);
$num = @$_GET['rand'];
$choice = @$urls[$num];
while(!$choice)
$choice = $urls[$num = rand(0, $len - 1)];
$prev = ($choice === 0 ? $len : $choice) - 1;
$next = ($choice + 1 === $len ? 0 : $choice) + 1;
?>
<img alt="Random Image" src="<?php echo $choice; ?>">
<a href="<?php echo $PHP_SELF . '?' . $prev; ?>">Previous</a>
<a href="<?php echo $PHP_SELF . '?' . $next; ?>">Next</a>
<?php } ?>

boxxertrumps
02-17-2007, 10:55 PM
the textbox is for showing the URL that the page is on. didnt think to use php self for this.