Форум

RGBPlus · #11 (**permalink**) 02.04.2014, 12:01

рони,
Спасибо с CSS уже разберусь, тут проблем нет

, ksa спустил на землю и напомнил об истоках!

Спасибо ребят, вопрос закрыт!

NeoN · #12 (**permalink**) 02.04.2014, 12:17

var items = document.getElementsByClassName('i-tabs');
for (i=0;i<items.length;i++){
  items[i].classList.add('b-tabs-'+(i+1));
}

RGBPlus · #13 (**permalink**) 02.04.2014, 12:36

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

var items = document.getElementsByClassName('i-tabs');
for (i=0;i<items.length;i++){
  items[i].classList.add('b-tabs-'+(i+1));
}

а это запишем, полезная вещь, пригодится когда ни будь!

RGBPlus · #14 (**permalink**) 02.04.2014, 13:00

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Untitled</title>
  <style type="text/css">
  .tabs li{
    float: left;
    width: 100px;
    border-bottom: #FF0000 2px solid;
    border-top:#FF0000 2px solid;
    list-style: none;
     padding: 4px;

  }
 .tabs li:first-child{
     border-left: #FF0000 2px solid;
    border-radius: 8px 0 0 8px;
  }
 .tabs li:last-child{
   border-right: #FF0000 2px solid;
    border-radius:0 8px 8px 0;
  }
  </style>
  <script>
    var items = document.getElementsByClassName('i-tabs');
    for (i=0;i<items.length;i++){
    items[i].classList.add('b-tabs-'+(i+1));
    }
  </script>
</head>
<body>
<ul class="tabs">
  <li class="i-tabs">
      <a href="#">my_title</a>
      <div>my_text</div>
  </li>
  <li class="i-tabs">
      <a href="#">my_title</a>
      <div>my_text</div>
  </li>
  <li class="i-tabs">
      <a href="#">my_title</a>
      <div>my_text</div>
  </li>
</ul>
</body>
</html>

не отрабатывает скрипт

ksa · #15 (**permalink**) 02.04.2014, 13:19

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

не отрабатывает скрипт

Когда работает скрип, элементов еще нет на странице...

RGBPlus · #16 (**permalink**) 02.04.2014, 13:23

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

Когда работает скрип, элементов еще нет на странице...

Не понял, как так, в чем подвох!?

рони · #17 (**permalink**) 02.04.2014, 13:31

RGBPlus,
window.onload — полностью загрузилась страница со всеми ресурсами.
http://learn.javascript.ru/onload-onerror#window-onload

Erolast · #18 (**permalink**) 02.04.2014, 13:36

Скрипты выполняются сразу же после загрузки. Вот у тебя тег <script> уже загрузился, скрипт уже отрабатывается, а остальные элемента еще не загружены. Надо либо писать скрипт после элементов, с которыми идет работа, либо сделать так:

window.onload = function()
{
    var items = document.getElementsByClassName('i-tabs');
    for (i=0;i<items.length;i++){
    items[i].classList.add('b-tabs-'+(i+1));
    }
}

Первое лучше, потому-что второй вариант сработает только после полной загрузки страницы, включая картинки.

RGBPlus · #19 (**permalink**) 02.04.2014, 13:44

Спасибо за пояснения! Сохранил, пример в архивчик, подписал, уложил на полку.

Форум

Справочник

Discord чат

Курсы javascript