Форум

wcb-falcon · #1 (**permalink**) 11.06.2008, 14:54

Хочу зделать у себя в сайте смену лого картинки лежащей беграйндом в таблице через CSS но не выходит

Подскажите пожалуйста в чем не прав (поправте на верный код)

в странице прописано:

<style type="text/css">
<!--
.td_fon_0 {background-image:url(fon_000.jpg); background-repeat:repeat-x;}
.td_fon_1 {background-image:url(fon_001.jpg); background-repeat:repeat-x;}
.td_fon_2 {background-image:url(fon_002.jpg); background-repeat:repeat-x;}
-->
</style>

<script language="javascript">
<!--
var tdimg = new Array();
tdimg[0] = 'td_fon_0';
tdimg[1] = 'td_fon_1';
tdimg[2] = 'td_fon_2';
var img = Math.random(0, 2);
var table = document.getElementById('fon');
var td = table[img]
td.style.className = tdimg[img];
// -->
</script>

<table width="300" height="100" border="0" cellpadding="0" cellspacing="0" >
  <tr>
    <td id="fon">Название сайта</td>
  </tr>
</table>

wcb-falcon · #2 (**permalink**) 11.06.2008, 15:15

ВСЕ
подумав немного нашел ошибки и решение таково:
1) блок стиля
2) блок таблицы
3) блок скрипта с поправками

<script language="javascript">
<!--
var tdimg = new Array();
tdimg[0] = 'td_fon_0';
tdimg[1] = 'td_fon_1';
tdimg[2] = 'td_fon_2';
var img = Math.floor(Math.random()*3);
var td = document.getElementById("fon");
td.className = tdimg[img];
// -->
</script>

Kolyaj · #3 (**permalink**) 11.06.2008, 15:17

Скрипт замените на

var img = Math.floor(Math.random() * 3);
document.getElementById('fon').className = 'td_fon_' + img;

UPD: почти одинаково получилось

Макс · #4 (**permalink**) 14.06.2008, 22:32

Послушай wcb-falcon может етот код тебе как-то подойдет?

<HTML>
	<HEAD>
		<script type="text/javascript">
			var imagesarr = new Array( "book1.jpg", "book2.jpg", "book3.jpg");
		</script>
	</HEAD>
	<BODY>
		<script language="JavaScript">
  			var los = Math.floor(Math.random() * imagesarr.length)
  			document.write ("<IMG SRC='"+imagesarr[los]+"'>");
		</script>
	</BODY>
</HTML>

вставь в массив свои фотки и при перезагрузке будет все окей!

Удачи!

Деонисий · #5 (**permalink**) 17.02.2009, 12:57

Огромное спасибо Максу, так быстро нашел... мне бы ещё скриптек, ч то при нажатии на картинку, она увеличивалась. А вообще кто разбирается в хтлм коде, стукните в асю 451888395, нужно помощь, не бесплатно

ikusei · #6 (**permalink**) 07.07.2010, 03:40

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

Скрипт замените на

var img = Math.floor(Math.random() * 3);
document.getElementById('fon').className = 'td_fon_' + img;

UPD: почти одинаково получилось

А как исправить этот скрипт, чтобы он менял этот DIV <div class="headerPick"> у меня в нем шапка сайта

<div class="topBlock">
<div class="dataBar"></div>
</div>
<div class="contentBlock">
<div class="headerPick">
<div class="navBar"><body>
</body></div>

.headerPick {background:url('/img/logo/58.jpg') no-repeat;}

Очень нужна помощь... Заранее благодарен

B~Vladi · #7 (**permalink**) 07.07.2010, 08:04

Здравствуйте!

Судя по вашему сообщению, вы ну совсем не знаете javascript.

Освойте основы языка и вопрос отпадет сам, полностью или частично.
А с чем не справитесь - поможем.

На сайте javascript можно начать изучать с учебника, раздел Основы javascript.
Возможно, вам также понадобится HTML - учебник есть, например, здесь: http://ru.html.net/tutorials/html/

Задавайте конкретные вопросы по ходу дела.

pandasensey · #8 (**permalink**) 07.07.2010, 12:36

Стоит отметить, что класс элемента может быть составным. Например:

<div class="myDiv myClass1 myClass2"></div>

В этом случае div унаследует все свойства трех css классов, при этом назначатся они будут в порядке слева на право. Это означает, что myClass1 может переопределить свойство background класса myDiv и т.д. То есть вы можете:

document.getElementById('headerPick').className = 'myDiv ' + 'bg_' + Math.floor(Math.random() * 3);

Это топорно конечно, но усложнять тоже не хочется. В итоге класс дива будет либо "myDiv bg_0" либо "myDiv bg_1" или "myDiv bg_2". Классы bg_0, bg_1, bg_2 вы описываете в CSS файле.

Kolyaj · #9 (**permalink**) 07.07.2010, 12:45

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

при этом назначатся они будут в порядке слева на право

<style type="text/css">
        .c1 {
            color: red;
        }
        .c2 {
            color: blue;
        }
    </style>

<span class="c1 c2">asdf</span>
<span class="c2 c1">asdf</span>

pandasensey · #10 (**permalink**) 07.07.2010, 15:46

Мда, ошибочка вышла.

<style type="text/css">
.c0 {color: #0F0;}
.c1 {color: #F00;}
.c2 {color: #00F;}
</style>
<span class="c0 c1">asdf</span>
<span class="c0 c2">asdf</span>

Но так работает. Складывается такое впечатление, что приоритет соответствует порядку следования классов в css?

Форум

Справочник

Discord чат

Курсы javascript