IMHO.WS - помогите со скриптом

IMHO.WS (https://www.imho.ws/index.php)

- Веб-программирование (https://www.imho.ws/forumdisplay.php?f=29)

- - помогите со скриптом (https://www.imho.ws/showthread.php?t=78037)

Reebok

20.01.2005 13:58

помогите со скриптом

Вложений: 1

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

Ghost

20.01.2005 14:09

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

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

З.З.Ы. Можешь сделать через CSS: создать класс для пуктов меню, и для него описать A и A:HOVER. Вот, например:

Код HTML:

<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 14:15

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

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

Ghost

20.01.2005 14:28

Reebok
Все очень просто. :) Например:

Код HTML:

<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 15:04

большой пасиб, кое-как получилось, только вот строку

Код:

HREF="#">menuitem1</A><IMG NAME="img1" SRC="empty.jpg">

нифига не понял.... если к примеру сама кнопка называется button.jpg и ссылается на index2.phpто как конструкция выглядеть будет ?

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

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

Ghost

21.01.2005 15: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.
Теперь все вместе:

Код HTML:

<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 17:02

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

Код HTML:

<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 17:13

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

Reebok

21.01.2005 17:20

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

Ghost

21.01.2005 17:26

У рисунков? Поставь на них параметр BORDER="0":

Код HTML:

<IMG SRC="..." BORDER="0">

Reebok

21.01.2005 17:32

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

Часовой пояс GMT +4, время: 06:40.