Случайная картинка через CSS

proxy · Конфигурация компьютера

может быть css на это и способен, но я о таком не слышал - даже интересно...

а вот с помощью php (при генерации старницы) или с помощью javaScript (при загрузке страницы) - это легко.
если надумаюшь, могу и примеры накинуть...

oIo_DeN_oIo · Отправлено: **18:16, 07-07-2009** | #3

готов выслушать примеры на яве и php

Но так же кто знает как это сделать через css отпишитесь.

proxy · Конфигурация компьютера

сааамый банальный пример:

Код:

<?
	function get_rnd_image(){
		$images[] = array('link' => 'images/image0.gif', 'width' => 200, 'height' => 100, 'desc' => 'image 0');
		$images[] = array('link' => 'images/image1.gif', 'width' => 100, 'height' => 150, 'desc' => 'image 1');
		$images[] = array('link' => 'images/image2.gif', 'width' => 150, 'height' => 200, 'desc' => 'image 2');
		
		$i = rand(0, 2);
		
		echo '<img border="1" id="rnd_image" src="'.$images[$i]['link'].'" width="'.$images[$i]['width'].'" height="'.$images[$i]['height'].'" alt="'.$images[$i]['desc'].'" />'."\n".
		'<br><b>link:</b> '.$images[$i]['link'].', <b>width:</b> '.$images[$i]['width'].', <b>height:</b> '.$images[$i]['height'].', <b>desc:</b> '.$images[$i]['desc']."\n";
	}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Тест</title>
</head>
<body>
<div id="root_wrapper">
	<br><br>
	<br>Вывод случайной картинки с помощью PHP:
	<br><? get_rnd_image(); ?>
	
	<br><br>
	<br>Вывод случайной картинки с помощью javascript:
	<br>
	<script type="text/javascript">
		function rand(min, max){ return Math.floor(Math.random() * (max - min + 1)) + min; }

		var images = [
			{'link':'images/image0.gif', 'width':200, 'height':100, 'desc':'image 0'},
			{'link':'images/image1.gif', 'width':100, 'height':150, 'desc':'image 1'},
			{'link':'images/image2.gif', 'width':150, 'height':200, 'desc':'image 2'},
		];
		
		var i = rand(0, 2);
		
		document.write('<img border="1" src="'+images[i]['link']+'" width="'+images[i]['width']+'" height="'+images[i]['height']+'" alt="'+images[i]['desc']+'" />\n');
		document.write('<br><b>link:</b> '+images[i]['link']+', <b>width:</b> '+images[i]['width']+', <b>height:</b> '+images[i]['height']+', <b>desc:</b> '+images[i]['desc']+'\n');
	</script>
	
	<br><br>Page content
	<br><br>Это простой пример, реализация может быть любой и очень разной.
	<br>Если происходит генерация страницы с помощью PHP, то JS бесмысленно использовать.
	<br>Но все зависит от задачи, например вариант: 
	<br>С помощью PHP выбрать случайную картинку, вывести её на страницу,
	<br>вывести на старинцу JS код, который в последствии, после загрузки страницы, будет менять картинку,
	<br>в любом порядке с любым спецэффекотм.
</div>
</body>
</html>

Это простой пример, реализация может быть любой и очень разной.
Если происходит генерация страницы с помощью PHP, то JS бесмысленно использовать.
Но все зависит от задачи, например вариант:
С помощью PHP выбрать случайную картинку, вывести её на страницу,
вывести на старинцу JS код, который в последствии, после загрузки страницы, будет менять картинку,
в любом порядке с любым спецэффекотм.