Тема в разделе PHP идет с большим успехом, предлагаю организовать и в JS
Хочу изучить Java Script, может поможете? Давайте задания, мы будем писать скрипты и т.д.
Пока что у меня знания базовые, начнем с чего-нибедь легкого, постепенно поднимаясь и совершенствуясь Ну вы меня поняли
Жду вопрос №1

М	Модератор Aliance: за каждое решение заданного мною вопроса буду ставить плюс тому, чье решение на мой вкус сочту наиболее правельным :thumbs-up

Это сообщение отредактировал(а) Aliance - 7.6.2005, 00:41

Начнем с того, что половина знаний - это теория. ИМХО, лучшее обучение - с книжкой. Хорошую литературу мы уже обсуждали.
Затем, подумай, кто сюда будет писать: в большинстве своем новички, чтобы получить быстро и бесплатно нужный им скрипт. Но новички наврятли смогут разумно оценить сложность скрипта => он может вполне не попасть под категорию ‘легкий’, с коего ты решил начать.
Я не сторониик такой темы, т.к. вместо того, чтобы сделать упорядоченный раздел (вопрос-ответ) мы "сольем" несколько таких тем в одну (эту) => получится хаос.

Но раз ты так хочешь и пока эта тема будет жить, давай попробуем.

Напиши мне сценарий для rollover изображений.
Условия:

• удобочитаемый вид кода
• сценарий основан на стандартах W3C DOM
• код работает в моделях IE & W3C DOM (совсестим с браузерами, минимум 5ой версии)

Так же каждая существенная строчка (т.е. строчку } не нужно) должна быть закомментирована - описание строчки.

Желаю удачи

ну давай не будем топить корабль, который еще не вышел в море

Посмотри в разделе PHP эта тема довольно хорошо прижилась

Вот накатал немного, можешь глянуть на rollover:

Код

<html> <head>   <title></title> <script language="JavaScript"> <!-- /* Всем привет! Вот ответ на вопрос №1 от Aliance:    Во-первых указываем что сейчас пойдет JS код это я сделал выше.    закоментируем весь мой код, для того чтоы Плохие браузеры (без поддержки JS) его не показывали. */ function rull_over()      //это я создал функцию =)      {           document.images[0].src='2.jpg';  /*                                              Обращаемся к нашему рисунку,                                              Т.К. он самый первый в появлении на странице,                                              его индекс будет 0. Дальше пишем, что значение                                              src нужно заменить на '2.jpg'                                            */      } function roll_up()        //это я создаю вторую функцию =)      {           document.images[0].src='1.jpg';   //В принципе действия аналогичные функции Э1      } //--> </script> </head> <body> <img src="1.jpg" onmouseover="rull_over();" onmouseout="roll_up();"> <!-- ну а здесь я просто      использую эти 2 функции по назначению. onmouseover - это событие, когда на картинку мы наводим      мышкой, а onmouseout - когда мы забираем мышку.      Если будут вопросы - пишите на PM =))) --> </body> </html>

PS Aliance молодец, не стал сразу грузить
Добавлено @ 22:30

Цитата(Aliance @ 6.6.2005, 20:09)

ценарий основан на стандартах W3C DOM

А как можно проверить?? Я конечно извеняюсь но просто не сталкивался еще с этим.

Это сообщение отредактировал(а) PHP-Script - 6.6.2005, 22:28

Хотелось бы функции, которые можно использовать при любом модернизации.

Подсказываю, если мне нужно так:

Код

<img src="test.jpg"> <img src="1.jpg" onmouseover="rull_over()" onmouseout="roll_up()">

То твоя функция не сработает как ожидалось

не проблема, щас исправим

Цитата(PHP @ 6.6.2005, 23:27)

А как можно проверить??

Т.е. использовать современные методы.
Скажем, вместо document.all[] - document.getElementById() и т.п.
http://www.w3.org

Все - исправил, смотри:

Код

<html> <head>   <title></title> <script language="JavaScript"> <!-- /* Всем привет! Вот ответ на вопрос №1 от Aliance:    Во-первых указываем что сейчас пойдет JS код это я сделал выше.    закоментируем весь мой код, для того чтоы Плохие браузеры (без поддержки JS) его не показывали. */ function rull_over(new_img)      //это я создал функцию =)      {           document.images[0].src=new_img;  /*                                              Обращаемся к нашему рисунку,                                              Т.К. он самый первый в появлении на странице,                                              его индекс будет 0. Дальше пишем, что значение                                              src нужно заменить на 'новый рисунок, который                                              мы передаем в параметрах к функции                                            */      } function roll_up(old_img)        //это я создаю вторую функцию =)      {           document.images[0].src=old_img;   //В принципе действия аналогичные функции №1      } //--> </script> </head> <body> <img src="1.jpg" onmouseover="rull_over('2.jpg');" onmouseout="roll_up('1.jpg');"> <!-- ну а здесь я просто      использую эти 2 функции по назначению. onmouseover - это событие, когда на картинку мы наводим      мышкой, а onmouseout - когда мы забираем мышку.      Если будут вопросы - пишите на PM =))) --> </body> </html>

Не совсем понял. Сделай еще так:
вторым аргументом передай глобальную ссылку This - она укажет на объект. А потом меняй this.src = new_src.
Ведь document.images[0] - меняет src только у первой картинки, что не есть гут.

А что, вроде неплохо, присоединюсь, мой вариант.

Код

<html>  <head>   <title>Rollover</title>   <script type="text/javascript" language="javascript">   <!--       // Первый аргумент - ID объекта       // Второй аргумент - новый "сорс" картинки.       function set_over(object, new_src)       {            // Делаем указатель на объект            var el = document.getElementById(object);            // Присваеваем новый "сорс" у картинки.            el.src = new_src;       }    // -->    </script> </head> <body> <img src="6.jpg" /> <br /> <img src="6.jpg" id="1" onmouseover="set_over(this.id, 'elf.gif')" onmouseout="set_over(this.id, '6.jpg')"/> </body> </html>

Альтернативный вариант, определенно заслуживающий внимания.

Код

<img src="image.gif" name="myImage"  defaultSrc="image.gif" selectedSrc="image-s.gif" onMouseOut="this.src = this.getAttribute('defaultSrc');" onMouseOver="this.src = this.getAttribute('selectedSrc');">

Однако стандарт XHTML его считает неправильным.

Исправил со всеми поправками, для дальнейшего просмотра.

Это сообщение отредактировал(а) Opik - 7.6.2005, 00:58

Цитата(Opr @ 7.6.2005, 00:30)

Однако как тут со стандартами - не знаю.

XHTML не прокатит.

Вариант Opr намного лучше.
Теперь, думаю, все. Вот минусы последнего (лучшего) варианта:

• нет предзагрузки картинок
• переменныя el объявлена как глобальная

Aliance

Цитата

переменныя el объявлена как глобальная

а как правильно?

Код

function set_over(object, new_src)       {            // Делаем указатель на объект            var el;            el = document.getElementById(object);            // Присваеваем новый "сорс" у картинки.            el.src = new_src;       }

?

Зачем же столько извратов Зри в корень:

Код

var el = document.getElementById(object);

Aliance
ок, хотел так... но всё же.. ) значит правильно понял, что делаем далее?

Цитата(Opr @ 7.6.2005, 00:47)

что делаем далее

скажем, скрытие текста.
Задача:
иммется надпись Скрыть, и текст внизу. Оба в своих дивах. При нажатии на надпись - текст скривается, а надпись меняется на показать. При нажатии снова - все наоборот
Условия:

• использование div`ов
• использование методов W3C или других совместимых
• быстрота работы

Aliance

Код

<html>  <head>   <title>Show/Hide</title>   <script type="text/javascript" language="javascript">   <!--       // Первый аргумент - указатель на слой, который нужно СКРЫТЬ       // Второй аргумент - указатель на слой, который нужно ПОКАЗАТЬ       function shide(sobject, hobject)       {            // Делаем указатели на объекты            var hel = document.getElementById(hobject);            var sel = document.getElementById(sobject);            // Показываем слой            hel.style.display = '';            // Скрываем слой            sel.style.display = 'none';       }    // -->    </script> </head> <body> <div id="show" > <a href="#" onclick="shide('show', 'hide')">Показать</a> 1 </div> <div id="hide" style="display: none"> <a href="#" onclick="shide('hide', 'show')">Скрыть</a> 2 </div> </body> </html>

Однако ещё можно через свойство visible вроде, только вот не помню, как точно, и что лучше тоже не знаю, и пользуясь случаем, спрашиваю, что лучше: display, или visible?

Это сообщение отредактировал(а) Opr - 7.6.2005, 00:11