Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Изменяющийся фон ячейки (реализация) (https://javascript.ru/forum/css-html/16517-izmenyayushhijjsya-fon-yachejjki-realizaciya.html)

CHEburaschka 11.04.2011 14:26

Изменяющийся фон ячейки (реализация)
 
Очень нужна помощь специалистов.

Есть задача максимум и задача минимум.

Минимум:
Необходимо сделать так, чтобы при обновлении страницы, в одной из ячеек таблицы подгружалась случайная фоновая картинка из папки.

Максимум:
Сделать так, чтобы фоновые картинки в ячейке сменяли одна другую (плавно), как слайд-шоу.

В этой ячейке также имеется вставленное изображение (не фоновое), оно остаётся постоянным и не меняется.

Может кто то подсказать как, это можно реализовать?


Сам случайный выбор, насколько я понимаю можно написать так...

<script language="JavaScript">
<!--
var a=Math.round(Math.random()*11)
image = new Array();
image[0]="\pica\2\image1.jpg"
image[1]="\pica\2\image2.jpg"
image[2]="\pica\2\image3.jpg"
image[3]="\pica\2\image4.jpg"
image[4]="\pica\2\image5.jpg"
image[5]="\pica\2\image6.jpg"
image[6]="\pica\2\image7.jpg"
image[7]="\pica\2\image8.jpg"
image[8]="\pica\2\image9.jpg"
image[9]="\pica\2\image10.jpg"
image[10]="\pica\2\image11.jpg"
image[11]="\pica\2\image12.jpg"

сcr="+image[a]+";
//-->
</script>

Но как потом взять значение переменной ccr и передать его параметру background в ячейке?

walik 11.04.2011 14:35

document.getElementById("place").style.background = "url("+ccr+")";

CHEburaschka 11.04.2011 20:24

Большое спасибо за скорый ответ!

мой скрипт написан в разделе head

таблица с нужной ячейкой, конечно же в разделе body

Где нужно вписать Ваш код?
document.getElementById("pica").style.background = "url("+ccr+")";

Я проовал дописать его в мой скрипт, но это не принесло результата.

код нужной ячейки выглядит так: <td id="pica" width="184" height="280"><img src="pica/ima.png" alt="ima" width="184" height="280" /></td>

walik 11.04.2011 22:17

Где хотите менять туда и вставляйте.
Если при обновление страницы то после вашего кода добавьте:
window.onload = function() {
     document.getElementById("pica").style.background = "url("+ccr+")";
}

CHEburaschka 12.04.2011 15:33

Вроде написал всё как описано Вами, но фоновые картинки не подгружаются. В чём может быть дело?

walik 12.04.2011 18:07

<html>
<head>
<script type="text/javascript" language="javascript">
window.onload = function() {
var a=Math.round(Math.random()*3) 
var images = [];
images[0] = 'http://javascript.ru/forum/images/smilies/smile.gif';
images[1] = 'http://javascript.ru/forum/images/smilies/laugh.gif';
images[2] = 'http://javascript.ru/forum/images/smilies/stop.gif';
images[3] = 'http://javascript.ru/forum/images/smilies/yes4.gif';
var ccr = images[a];
document.getElementById("pica").style.background = "url("+ccr+")";
}
</script>
<style>
#pica {width: 100px;height: 100px;}
</style>
</head>
<body>
<div id="pica"></div>
</body>
</html>


Часовой пояс GMT +3, время: 06:45.