VPF::управление элементом без идентификатора

bars80080

Дата 21.12.2007, 14:24 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

вопрос проистекает отсюда: http://forum.vingrad.ru/forum/topic-186837.html

вот случай, у меня нет возможности писать в элементе:

Код

<img id="img1" src="" onmouseover="funks('img1')" />

могу просто

Код

<img src="" onmouseover="funks()" />

как можно в функции funks() получить возможность управлять именно вызвавшим её элементом

п.с. почему нет возможности?
элементов несколько и нет возможности задать порядок идентификаторов
если бы я сам вставлял в код imgы, то на пхп сумел бы прописать img1 img2 и т.д.,
но используется существующий скрипт вставки баннеров и он вставляет код как есть, без пхп

Добавлено через 10 минут и 18 секунд
блин, как всегда долго туплю, потом задаю вопрос и за пять минут нахожу очевидный ответ

Код

<img src="" onmouseover="funks(this)" />

bars80080

Дата 21.12.2007, 16:18 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

давайте продолжим

передал, я грубо говоря "идентификатор" (не знаю как его иначе назвать) в функцию
получил возможность с объектом всякие непотребности делать
скажем мне нужно поменять ширину объекта (на примере того же img)

как мне зациклить эту функцию на время, чтобы можно было сделать плавное увеличение,
ведь в setTimeout('funks(x)', 100); параметр x передать нельзя

Код


function funks(x, w) {
    if(isNaN(w)) w = x.width;
    var w1 = x.width + 1;
    x.width = w1;
    if(w1 < (1.1*w)) tmp = setTimeout('funks()', 100); }

а так он теряется

понимаю, что есть вполне очевидные и простые решения, но js трудно поддаётся мне в своих нюансах

Добавлено через 4 минуты и 14 секунд
или как сделать этот x (объект) доступным после перевызова функции?

InfMag

Дата 21.12.2007, 16:31 (ссылка)

(нет голосов)

Загрузка ...

…

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 21.11.2004

Репутация: 2
Всего: 4

Если у тега нет идентификатора, то у него можно получить значение очереди вывода:

Код


<div id="idcontainer">
<img src="img1.jpg">
<img src="img2.jpg">
<img src="img3.jpg">
<img src="img4.jpg"> - Вот у этого тега должен поменяться style, подсчет очереди идет с нуля
<img src="img5.jpg">
<img src="img6.jpg">
<img src="img7.jpg">
<img src="img8.jpg">
<img src="img9.jpg">
</div>

Код


function parse()
{
   var сontainer = document.getElementById('idcontainer'); if (!сontainer ) return;
   var tags = container.getElementsByTagName('IMG');
   tags[3].style.cssText = 'border: 5px #000000 solid;';
}

Ну этот вариант только если ты точно знаешь какой это тег по счету

Это сообщение отредактировал(а) InfMag - 31.7.2009, 12:59

ksnk

Дата 21.12.2007, 16:38 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

Код


function funks(x, w) {
    if(isNaN(w)) w = x.width;
    var w1 = x.width + 1;
    x.width = w1;
    if(w1 < (1.1*w)) tmp = setTimeout(function(){funks(x,w);}, 100); }

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

bars80080

Дата 21.12.2007, 16:41 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

вряд ли прокатит
страница собирается из пяти составляющих, причём такие как header.php включает в себя меню, отстраиваемое по бд,
то есть количество тэгов меняется довольно часто,

единственное, что я могу, это скажем обвести все эти img дивом с идентификатором, и в нём в принципе подсчитывать что за элемент, но подсчёт ведь ведётся в основных коллекциях (elements[], frames[], images[])
можно ли подсчитать в конкретной ?, типа:

Код

document.getElementById('image_block').tags[3].width

сейчас попробую, но вряд ли...

всё равно, знаю что есть способ передать объект, не знаю только какой
блин, в пхп бы просто global $x и всё, а здесь хз

Добавлено через 37 секунд
так так, щас ksnk попробуем

Добавлено через 3 минуты и 5 секунд
блина, работает

спасибо!

Ghirik

Дата 21.12.2007, 21:52 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 919
Регистрация: 26.3.2007

Репутация: 13
Всего: 20

Если заключить в дополнительный контейнер, то можно наверное так:

Код


var img = document.getElementById('image_block').grtElementsByTagName('img');
img[3].onmouseover = funks; // или можно в цикле назначит события всему массиву элементов.
img[3].onmouseout = funks;

function funks(e) {
    if(!e)  var e = window.event;
    e.type == 'onmouseover' ? this.style.cssText = 'border: 5px #000000 solid' : this.style.cssText = 'border: 5px #FFFFFF solid' 
}

Не подойдет?

Это сообщение отредактировал(а) Ghirik - 21.12.2007, 21:52

--------------------

Отдадим всё клиенту, пускай его машина мучается...

bars80080

Дата 24.12.2007, 11:16 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

в принципе, меня устроило решение ksnk - чётче
но вашу я тоже проверил, не думал, что предложение infmaq будет рабочим
однако, может я не заметил чего, но:

Код


<style>
img { width: 100px; height: 100px; }
</style>
<img src="00fon00.png" />1
<img src="00fon00.png" />2
<img src="00fon00.png" />3
<div id="image_block">
<img src="00fon00.png" />4
<img src="00fon00.png" />5
<img src="00fon00.png" />6
<img src="00fon00.png" />7
<img src="00fon00.png" />8
</div>
<script>
var img = document.getElementById('image_block').getElementsByTagName('img');
img[3].onmouseover = funks; // èëè ìîæíî â öèêëå íàçíà÷èò ñîáûòèÿ âñåìó ìàññèâó ýëåìåíòîâ.
img[3].onmouseout = funks;

function funks(e) {
    if(!e) { var e = window.event;
    if(e.type == 'onmouseover') this.style.cssText = 'border: 5px #00ff00 solid';
    else this.style.cssText = 'border: 5px #ff0000 solid'; }
}
</script>

срабатывает при onmouseover только ветка else, а onmouseout вообще не работает

хотелось бы найти верное решение для будущих разработок

Ghirik

Дата 25.12.2007, 11:28 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 919
Регистрация: 26.3.2007

Репутация: 13
Всего: 20

Я же вот так функцию записал:

Код


function funks(e) {
    if(!e)  var e = window.event;
    e.type == 'onmouseover' ? this.style.cssText = 'border: 5px #000000 solid' : this.style.cssText = 'border: 5px #FFFFFF solid' 
}

или тогда уж так:

Код


function funks(e) {
    if(!e) var e = window.event;
    if(e.type == 'onmouseover') this.style.cssText = 'border: 5px #00ff00 solid';
    else this.style.cssText = 'border: 5px #ff0000 solid';
}

Это сообщение отредактировал(а) Ghirik - 25.12.2007, 11:29

--------------------

Отдадим всё клиенту, пускай его машина мучается...

bars80080

Дата 25.12.2007, 11:54 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

нет это понятно,
просто от системы ? : у меня слегка рябит в глазах (неудобно воспринимать),
поэтому, когда не заработала, то я переправил в более простую конструкцию

но и вот сейчас, тупо скопировав ваш код, он всё равно не пашет
, то есть в ИЕ на наведение мыши появляется красная граница (хотя должна зелёная), а вот на onmouseout, ничего

а вы проверяли эту штуку? или это у меня глючит?

спасибо

Ghirik

Дата 25.12.2007, 12:01 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 919
Регистрация: 26.3.2007

Репутация: 13
Всего: 20

Ага, ага собрал страничку, нужно было Вам сразу выложить готовую страницу... Сейчас разберусь...

Добавлено через 5 минут и 51 секунду
Косякнул с названием события, вот так работает:

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Title block</title>
<script type="text/javascript">
<!--
function on() {
 var img = document.getElementById('image_block').getElementsByTagName('img');
 for (var i = 0; i < img.length; i++) {
 img[i].onmouseover = funks; // или можно в цикле назначит события всему массиву элементов.
 img[i].onmouseout = funks;
 img[i].setAttribute('border', '10px');
 }
}
function funks(e) {
    if(!e)  var e = window.event;
    if (e.type == 'mouseover') {
    this.setAttribute('border', '5px');
    }
    else {
    this.setAttribute('border', '10px');
    }
}
//-->
</script>
</head>
<body onload="on()">
<img src="00fon00.png" />1
<img src="00fon00.png" />2
<img src="00fon00.png" />3
<div id="image_block">
<img src="" width="47" height="68" />
<img src="" width="47" height="68" />
<img src="" width="47" height="68" />
<img src="" width="47" height="68" />
<img src="" width="47" height="68" />
</div>
</body>
</html>

--------------------

Отдадим всё клиенту, пускай его машина мучается...

bars80080

Дата 25.12.2007, 13:07 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 15
Всего: 315

о, прикольно,

всё везде работает

спасибо за беспокойство

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »