Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.05.2011, 15:19
Новичок на форуме
Отправить личное сообщение для radar080 Посмотреть профиль Найти все сообщения от radar080
 
Регистрация: 12.05.2011
Сообщений: 4

Проблема с onLoad и onResize в CMS Joomla
Написал маленький скриптик:
function ChHgh() {
if (document.body.clientWidth < 1250) {
var div = document.getElementsByTagName('div');
for (var i = 0; i < div.length; i++){
if (div[i].className == 'column1'){
div[i].style.width = '100%';
}}
}
}
И прикрепил его в head обычной html-страницы, обработчики событий в body прописал:
<body onload="ChHgh();" onresize="ChHgh();">
Ура, всё работает!

После этого эксперимента прикрепил этот же скиптик в шаблон Joomla (и обработчики, в body шаблона прописал)
Ошибок консоль Firebug не выдаёт, а скиптик не работает!

Если кто знает (или сталкивался), объясните, пожалуйста, что я не учел?
Ответить с цитированием
  #2 (permalink)  
Старый 13.05.2011, 16:24
Новичок на форуме
Отправить личное сообщение для radar080 Посмотреть профиль Найти все сообщения от radar080
 
Регистрация: 12.05.2011
Сообщений: 4

Чуть-чуть разобрался, в чем причина ошибки. Но исправить всё таки не смог.

В эксперементальной html-странице у меня нет вложеных элементов, а в Joomla - есть. Мой скрипт не работает именно из-за этого. Вот, как я его слегка изменил:

function ChHgh() {
if (document.body.clientWidth < 1250) {
var div = document.getElementById('content').getElementsByTa gName('div');
for (var i = 0; i < div.length; i++){
if (div[i].className == 'blog-post'){
div[i].style.width = '100%';
}}
}
}

Но таким образом я добрался только до первого вложеного слоя (div.blog-post), а у меня внутри него ещё один есть, внутри которого находится ещё один, нужный мне для изменения скриптом слой.

Подскажите, пожалуйста, как до него добраться? (Мучаюсь уже второй день)
Вот, DOM-дерево (сокращённое, конечно) из joomla-сгенерированной страницы:

<div id="content">
<div class="blog-post">
<div class="article_row-post">
<div class="article_column column1 cols2">

(Это слой, к которому я никак не могу подобраться)

</div>
</div>
</div>
</div>

Последний раз редактировалось radar080, 13.05.2011 в 16:31.
Ответить с цитированием
  #3 (permalink)  
Старый 13.05.2011, 20:46
Новичок на форуме
Отправить личное сообщение для radar080 Посмотреть профиль Найти все сообщения от radar080
 
Регистрация: 12.05.2011
Сообщений: 4

Почти исправил
Вот таким образом я добрался до второго потомка:
function ChHgh() {
if (document.body.clientWidth < 900) {
var one = document.getElementById('content');
for (var i = 0; i < one.childNodes.length; i++){
two = one.childNodes[i];
for (var i = 0; i < two.childNodes.length; i++){
three = two.childNodes[i];
for (var i = 0; i < three.childNodes.length; i++){
if (three.className == 'article_row-post'){
three.style.color = 'red';
}}
}
}
}
}
До этого уровня всё работает прекрасно.

Остался третий потомок. Но когда я добавляю цикл для его поиска:
four = three.childNodes[i];
for (var i = 0; i < four.childNodes.length; i++){
if (four.className == 'article_column'){
four.style.color = 'red';
}}
}
}
}
}
}

браузер почему-то виснет...

Осталась какая-то мелкая ошибка, не могу её найти.

<div id="content">
<div class="blog-post">
<div class="article_row-post">

(Это слой, к которому я уже подобрался)

<div class="article_column column1 cols2">

(Это слой, к которому я никак не могу подобраться)

</div>
</div>
</div>
</div>

Последний раз редактировалось radar080, 13.05.2011 в 20:49.
Ответить с цитированием
  #4 (permalink)  
Старый 14.05.2011, 13:55
Новичок на форуме
Отправить личное сообщение для radar080 Посмотреть профиль Найти все сообщения от radar080
 
Регистрация: 12.05.2011
Сообщений: 4

Всё, разобрался (ещё вчера вечером), вот финальный вариант скрипта:
function ChHgh() {
if (document.body.clientWidth < 1250) {
var one = document.getElementById('content');
for (var i = 0; i < one.childNodes.length; i++){
two = one.childNodes[i];
for (var i = 0; i < two.childNodes.length; i++){
three = two.childNodes[i];
for (var i = 0; i < three.childNodes.length; i++){
if (three.childNodes[i].className == 'article_column column1 cols2'){
three.childNodes[i].style.width = '100%';
}}
}
}
}
}

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

P.S. Всем спасибо (за внимание)...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Template CMS 2.0 Awilum Ваши сайты и скрипты 40 14.05.2011 17:30
Новая система управления сайтом Scripto CMS deepslam Ваши сайты и скрипты 38 31.01.2011 14:55
Template CMS - маленькая и быстрая CMS Awilum Ваши сайты и скрипты 3 22.09.2010 23:19