Форум

sarik · #11 (**permalink**) 18.02.2013, 09:38

<script>
function img_size(val){
 var img = document.getElementById("kartinka");
 switch(val){
  case "0":
   img.src = "img/2.png";
   break;
  case "00":
   img.src = "img/3.png";
   break;
  case "135":
   img.src = "img/4.png";
   break;
  case "235":
   img.src = "img/5.png";
   break;
 case "450":
   img.src = "img/6.png";
   break;
 }
}

</script>

<input type="radio" name="simple" value="0"   onclick="img_size(this.value)" />Крассный `Flash`
<input type="radio" name="simple" value="00"  onclick="img_size(this.value)" />Синий `Sea Blue`

цвета я так сделал ради проби.. надо всего лишь сделать все как по формуле а потом во время доделки дизайна точно будуть работать цвета и дизайн хорошая будеть

рони · #12 (**permalink**) 18.02.2013, 09:38

sarik,
если картинок мало можно сделать предварительную загрузку, тогда смены картинок ненужно будет ждать.
2 способ ставить картинку загрузки основную прятать а на onload основной убирать картинку загрузки и показывать основную.
ищите по форуму - это было

sarik · #13 (**permalink**) 18.02.2013, 09:45

картинок точно мало но как сделать как вы говорите???? по подробнее и с js если можно обясьните .заранее спасибо

рони · #14 (**permalink**) 18.02.2013, 10:38

sarik,
примерно так 2 вариант ...

<!DOCTYPE HTML>

<html>

<head>
<meta charset="utf-8" />
  <title></title>
</head>

<body>
<script>
var img_r = new Image();
img_r.src = "http://javascript.ru/forum/images/smilies/write.gif";
function img_size(val){
 var kartinka = document.getElementById("kartinka");
 kartinka.src = img_r.src;
 var img = new Image();
 img.onload = function() {
 kartinka.src = this.src
    };

 switch(val){
  case "0":
   img.src = "http://www.starlexx.com/Touareg/img/2.png";
   break;
  case "00":
   img.src = "http://www.starlexx.com/Touareg/img/3.png";
   break;
  case "135":
   img.src = "http://www.starlexx.com/Touareg/img/4.png";
   break;
  case "235":
   img.src = "http://www.starlexx.com/Touareg/img/5.png";
   break;
 case "450":
   img.src = "http://www.starlexx.com/Touareg/img/6.png";
   break;
 }
}

</script>
<img src="http://www.starlexx.com/Touareg/img/1.png" border="0" alt=""  id="kartinka"/>
<input type="radio" name="simple" value="0"   onclick="img_size(this.value)" />Крассный `Flash`
<input type="radio" name="simple" value="00"  onclick="img_size(this.value)" />Синий `Sea Blue`
<input type="radio" name="simple" value="135"   onclick="img_size(this.value)" />Крассный `Flash`
<input type="radio" name="simple" value="235"  onclick="img_size(this.value)" />Синий `Sea Blue`
<input type="radio" name="simple" value="450"   onclick="img_size(this.value)" />Крассный `Flash`
</body>

</html>

начало скрипта надеюсь вам даст понятие как организовать предварительную загрузку.

ksa · #15 (**permalink**) 18.02.2013, 10:47

Сообщение от sarik

картинок точно мало но как сделать как вы говорите?

Как вариант...

var img_path = new Array("1.jpg", "2.jpg"); 
var img = new Array(); 
var count = img_path.length; 
for(var i=0; i<count; i++){ 
   img[i] = new Image(); 
   img[i].src = img_path[i]; 
}

sarik · #16 (**permalink**) 18.02.2013, 11:27

Получилось!!!!!Ураааааа

СПасибо всем кто помог

Форум

Справочник

Discord чат

Курсы javascript