PDA

Просмотр полной версии : помогите со скриптом


Reebok
20.01.2005, 12:58
В web-программировании полный чайник. На диплом делаю сайт. И необходим скрипт, позволяющий при наведении мыши на пункт меню отображал бы справа от него небольшой прямоугольник. На изображении в аттаче прямоугольники показаны у всех кнопок.
Вот. А ещё скрипт, кот. слева от активного пункта меня(в кот. нахожусь в данный момент) отображал бы тоже картинку.
Посоветуйте. Искал в двух коллекциях, но описания там к скриптам больно короткие. Спасибо.

Ghost
20.01.2005, 13:09
Reebok
Вставь слева и справа от пунктов меню прозрачные рисунки, и сделай для них (пунктов меню) обработчики OnMouseOver - замена этих рисунков на нужные, и OnMouseOut - возврат прозрачных рисунков.

З.Ы. Посмотри еще вот это: http://imho.ws/showthread.php?p=732815#post732815

З.З.Ы. Можешь сделать через CSS: создать класс для пуктов меню, и для него описать A и A:HOVER. Вот, например:<HTML>
<HEAD>
<STYLE>
.mydiv { background-color: #C02020; }
a .mydiv { background-color: #20C020; }
a:hover .mydiv { background-color: #2020C0; }
</STYLE>
</HEAD>
<BODY>
<A HREF="#"><DIV CLASS="mydiv">menuitem1</DIV></A>
<DIV CLASS="mydiv">menuitem2</DIV>
<A HREF="#"><DIV CLASS="mydiv">menuitem3</DIV></A>
</BODY></HTML>Соответственно, тебе нужно будет использовать в стилях background-image.

Reebok
20.01.2005, 13:15
Ghost
я наверное не так выразился по поводу "программирования и чайника", правильно сказать - это я вообще не видел явускрипт :rolleyes:

за ссылку сеньк

Ghost
20.01.2005, 13:28
Reebok
Все очень просто. :) Например:<HTML>
<BODY>
<A
onMouseOver="javascript:img1.src='rect.jpg';"
onMouseOut="javascript:img1.src='empty.jpg';"
HREF="#">menuitem1</A><IMG NAME="img1" SRC="empty.jpg">
</BODY>
</HTML>

Reebok
21.01.2005, 14:04
большой пасиб, кое-как получилось, только вот строку
HREF="#">menuitem1</A><IMG NAME="img1" SRC="empty.jpg">
нифига не понял.... если к примеру сама кнопка называется button.jpg и ссылается на index2.phpто как конструкция выглядеть будет ?

кстати, в php этот код менять как-нить надобно(в отличае от html) ?

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

Ghost
21.01.2005, 14:21
Гыхм...
1. PHP генерирует HTML-код. Что ты в PHP-скрипте напишешь, то и будет передаваться браузеру HTML-странице.
2. Тоненька синяя линия подчеркивания появилась изза пробела(ми) перед тегом </A>. Либо убери их, либо вынеси за пределы блока <A>...</A>.
3. button.jpg - источник рисунка, а не имя элемента; имя задается в параметре NAME="..." (в моем примере - NAME="img1").
4. URL ссылки вставляется в параметр HREF тэга A. В своем примере я фактически поставил туда ссылку на текущую страницу (#). Тебе нужно заменить ее на index.php.
5. Если линк связан только с рисунком и не с чем более на странице, можно вместа тэга <A> использовать обработчик OnClick.
Теперь все вместе:<IMG SRC="button.jpg" NAME="img1"
onMouseOver="javascript:img1.src='button_over.jpg';"
onMouseOut="javascript:img1.src='button.jpg';"
onClick="javascript:window.location='index.php';">

Reebok
21.01.2005, 16:02
тьфу, сорри, всё из-за моей невнимательности ))
разобрался в обоих случаях. с самого начала не увидел, что объекту даётся имя img1, ну а потом этому объекту меняется картинка ))) в оьщем сделал конструкцией один, вот так:

<A
onMouseOver="javascript:red_stolbik.src='red.jpg';"
onMouseOut="javascript:red_stolbik.src='pusto.gif';"
HREF="index2.php"><IMG SRC="button.jpg"></A><IMG NAME="red_stolbik" SRC="pusto.gif">


в експловере обводка синяя видня, а в опере всё ОК

ещё вопрос можно ? как сделать так, чтобы при нажатии на кнопку открывалась ссылка, но там перед этой кнопкой стоял тоже прямоугольник... т.е. в общем то это можно бить и в структуру страницы php, но может и через яву как то можно ?

Ghost
21.01.2005, 16:13
Reebok
Можно через яву - но это гемор - придется после загрузки страницы сканить массив ссылок и 1. удалять ненужную, 2. вставлять рядом с соответсвующей ссылкой ентот твой прямоугольник... Лучше в ПХП. Т.е. сразу формировать страницу без ссылки на пункте меню и с нужным рисунком.

Reebok
21.01.2005, 16:20
пнятно, будем через пхп... а по поводу обводки синей в экспловере?

Ghost
21.01.2005, 16:26
У рисунков? Поставь на них параметр BORDER="0":<IMG SRC="..." BORDER="0">

Reebok
21.01.2005, 16:32
кул )))
вот чего получилось http://daband.nm.ru/java/
попозджя слева буду делать