random images - JavaScript, Ajax

dream1k · 27.03.2011, 16:24

Здравствуйте. Нужна ваша помощь. Не могу понять как сделать чтобы 2 таблички были по центру (горизонтально). В таблицах - фотографии.

Код:

<HTML> 
<HEAD>
<title>Goddesses</title>
</head>
<body>
<br><center><H2> Random selection of Goddesses</H2><center>
<table  border="2" cellspacing="5" bordercolor="#4A708B">
<tr>
<td>
<script language="javascript">
<!--
var a=Math.round(Math.random()*5) 
image = new Array();
image[0]="1.jpg"
image[1]="2.jpg"
image[2]="3.jpg"
image[3]="4.jpg"
image[4]="5.jpg"
image[5]="6.jpg"
document.write ("<img src="+image[a]+">");
//-->
</script>
</td>
</tr>
</table>

<br><br><table  border="2" cellspacing="5" bordercolor="#4A708B">
<tr>
<td>
<script language="javascript">
<!--
var a=Math.round(Math.random()*5) 
image = new Array();
image[0]="1.jpg"
image[1]="2.jpg"
image[2]="3.jpg"
image[3]="4.jpg"
image[4]="5.jpg"
image[5]="6.jpg"
document.write ("<img src="+image[a]+">");
//-->
</script>
</td>
</tr>
</table>

<BODY BACKGROUND="D:\random image\background.jpg">

<BODY BGCOLOR="#DCDCDC" TEXT="#800080" LINK="#A020F0">
</BODY>
</HTML>

dream1k · 28.03.2011, 17:39

Код:

<script language="javascript">
<!--
var a=Math.round(Math.random()*5) 
image = new Array();
image[0]="1.jpg"
image[1]="2.jpg"
image[2]="3.jpg"
image[3]="4.jpg"
image[4]="5.jpg"
image[5]="6.jpg"
document.write ("<img src="+image[a]+">");
//-->
</script>

Подскажите пожалуйста как в этом скрипте сделать картинки кликабельными?

Wicort · 28.03.2011, 17:51

Всмысле кликабельными? Имеете ввиду, что при нажатии на ссылку должно что-то происходить? Тогда зависит от того, что именно должно произойти.
А вообще, вешайте на image событие onclick, в котором будете делать то, что Вам нужно.
Например, сделующий код будет при клике на картинку будет выдаваться сообщение со значением из Вашего массива.

Код:

<script language="javascript">
<!--

var a=Math.round(Math.random()*5) 
image = new Array();
image[0]="1.bmp"
image[1]="2.bmp"
image[2]="3.bmp"
image[3]="4.bmp"
image[4]="5.bmp"
image[5]="6.bmp"
document.write ("<img src="+image[a]+" onclick = 'msg("+a+")'>");
function msg(sender)
{
  alert(image[a]);
}
//-->
</script>

dream1k · 28.03.2011, 19:08

У меня есть 2 таблицы с картинками. При клике на картинку нужно чтобы они как бы заменялись другими (рандом). Таким образом будет происходить смена картинок.

spein · 28.03.2011, 23:43

примерно так:
JavaScript

Код:

<script>
function ch() {
img = document.getElementById('img');
var a=Math.round(Math.random()*5) 
image = new Array();
image[0]="1.bmp"
image[1]="2.bmp"
image[2]="3.bmp"
image[3]="4.bmp"
image[4]="5.bmp"
image[5]="6.bmp"
img.src=image[a];
}
</script>
<img id='img' src='1.bmp'>

dream1k · 29.03.2011, 01:26

Что-то не кликается.

Wicort · 29.03.2011, 11:44

что-то типа этого?

Код:

<html>
<head>

<script language="javascript">
<!--
image = new Array();
image[0]="1.bmp"
image[1]="2.bmp"
image[2]="3.bmp"
image[3]="4.bmp"
image[4]="5.bmp"
image[5]="6.bmp"

function rndPic()
{
  var a=Math.round(Math.random()*5)
  document.all("picture").src = image[a];  
}
//-->
</script>

</head>

<body onload = "rndPic();">
<img id = "picture" onclick = "javascript:rndPic();"/>

</body>
</html>

dream1k · 30.03.2011, 19:54

Да! Простите что надоедаю...

Что нужно изменить чтобы выводилось 2 картинки?

Wicort · 31.03.2011, 14:02

вот это выводит картинку:

Код:

<img id = "picture" onclick = "javascript:rndPic();"/>

здесь id = "picture" - уникальный идентификатор. В документе он не должен повторяться.
Соответственно, если хотите добавить ещё одну картинку, вставьте ниже ещё одну такую же строку.
Если хотите, чтобы обе картинки менялись при клике на них, то код нужно немного модифицировать.
Во-первых, нужно передавать в процедуру объект, ка который кликнули.
Для этого в onclick вызываем уже rndPic(this);
В this будет та картинка, на которой кликнули.
Сама функция изменится так:

Код:

function rndPic(obj)
{
  var a=Math.round(Math.random()*5)
  obj.src = image[a];  
}

dream1k · 31.03.2011, 16:33

Так?

Код:

<HTML> 
<HEAD>
</HEAD>
<BODY>

<script language="javascript">
<!--
image = new Array();
image[0]="1.jpg"
image[1]="2.jpg"
image[2]="3.jpg"
image[3]="4.jpg"
image[4]="5.jpg"
image[5]="6.jpg"

function rndPic(obj)
{
  var a=Math.round(Math.random()*5)
  obj.src = image[a];  
}
//-->
</script>

<body onload = "rndPic();">
<img id = "picture" onclick = "javascript:rndPic(this);"/>
<img id = "picture" onclick = "javascript:rndPic(this);"/>

</BODY>
</HTML>

28.03.2011, 17:39	#2
dream1k Пользователь Регистрация: 27.03.2011 Сообщений: 13	Код: `<script language="javascript"> <!-- var a=Math.round(Math.random()5) image = new Array(); image[0]="1.jpg" image[1]="2.jpg" image[2]="3.jpg" image[3]="4.jpg" image[4]="5.jpg" image[5]="6.jpg" document.write ("<img src="+image[a]+">"); //--> </script>` Подскажите пожалуйста как в этом скрипте сделать картинки кликабельными?* *Nobody will remember you for your thoughts...*

28.03.2011, 17:51	#3
Wicort Форумчанин Регистрация: 04.08.2009 Сообщений: 684	Всмысле кликабельными? Имеете ввиду, что при нажатии на ссылку должно что-то происходить? Тогда зависит от того, что именно должно произойти. А вообще, вешайте на image событие onclick, в котором будете делать то, что Вам нужно. Например, сделующий код будет при клике на картинку будет выдаваться сообщение со значением из Вашего массива. Код: `<script language="javascript"> <!-- var a=Math.round(Math.random()*5) image = new Array(); image[0]="1.bmp" image[1]="2.bmp" image[2]="3.bmp" image[3]="4.bmp" image[4]="5.bmp" image[5]="6.bmp" document.write ("<img src="+image[a]+" onclick = 'msg("+a+")'>"); function msg(sender) { alert(image[a]); } //--> </script>` Еслия Вам помог, не поленитесь нажать на весы и оставить отзыв. Это не займет много времени, но даст понять, что я старался не зря =) Мой ник зарегистрирован, а твой?

29.03.2011, 01:26	#6
dream1k Пользователь Регистрация: 27.03.2011 Сообщений: 13	Что-то не кликается. *Nobody will remember you for your thoughts...*

29.03.2011, 11:44	#7
Wicort Форумчанин Регистрация: 04.08.2009 Сообщений: 684	что-то типа этого? Код: `<html> <head> <script language="javascript"> <!-- image = new Array(); image[0]="1.bmp" image[1]="2.bmp" image[2]="3.bmp" image[3]="4.bmp" image[4]="5.bmp" image[5]="6.bmp" function rndPic() { var a=Math.round(Math.random()*5) document.all("picture").src = image[a]; } //--> </script> </head> <body onload = "rndPic();"> <img id = "picture" onclick = "javascript:rndPic();"/> </body> </html>` Еслия Вам помог, не поленитесь нажать на весы и оставить отзыв. Это не займет много времени, но даст понять, что я старался не зря =) Мой ник зарегистрирован, а твой?

31.03.2011, 14:02	#9
Wicort Форумчанин Регистрация: 04.08.2009 Сообщений: 684	вот это выводит картинку: Код: `<img id = "picture" onclick = "javascript:rndPic();"/>` здесь id = "picture" - уникальный идентификатор. В документе он не должен повторяться. Соответственно, если хотите добавить ещё одну картинку, вставьте ниже ещё одну такую же строку. Если хотите, чтобы обе картинки менялись при клике на них, то код нужно немного модифицировать. Во-первых, нужно передавать в процедуру объект, ка который кликнули. Для этого в onclick вызываем уже rndPic(this); В this будет та картинка, на которой кликнули. Сама функция изменится так: Код: `function rndPic(obj) { var a=Math.round(Math.random()*5) obj.src = image[a]; }` Еслия Вам помог, не поленитесь нажать на весы и оставить отзыв. Это не займет много времени, но даст понять, что я старался не зря =) Мой ник зарегистрирован, а твой?

28.03.2011, 19:08	#4
dream1k Пользователь Регистрация: 27.03.2011 Сообщений: 13	У меня есть 2 таблицы с картинками. При клике на картинку нужно чтобы они как бы заменялись другими (рандом). Таким образом будет происходить смена картинок. *Nobody will remember you for your thoughts...* Последний раз редактировалось dream1k; 28.03.2011 в 21:24.

30.03.2011, 19:54	#8
dream1k Пользователь Регистрация: 27.03.2011 Сообщений: 13	Да! Простите что надоедаю... Что нужно изменить чтобы выводилось 2 картинки? *Nobody will remember you for your thoughts...*

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Random	adm2010	Общие вопросы Delphi	4	23.01.2011 13:39
Random	ZET78	C++ Builder	5	23.05.2010 09:36
Вывод содержимого images..	firmwares	Мультимедиа в Delphi	2	02.02.2010 01:27
C# Добавление images в RichTextBox	ameli	Помощь студентам	0	11.05.2009 16:22