Просмотр полной версии : помогите со скриптом
В web-программировании полный чайник. На диплом делаю сайт. И необходим скрипт, позволяющий при наведении мыши на пункт меню отображал бы справа от него небольшой прямоугольник. На изображении в аттаче прямоугольники показаны у всех кнопок.
Вот. А ещё скрипт, кот. слева от активного пункта меня(в кот. нахожусь в данный момент) отображал бы тоже картинку.
Посоветуйте. Искал в двух коллекциях, но описания там к скриптам больно короткие. Спасибо.
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.
Ghost
я наверное не так выразился по поводу "программирования и чайника", правильно сказать - это я вообще не видел явускрипт :rolleyes:
за ссылку сеньк
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>
большой пасиб, кое-как получилось, только вот строку
HREF="#">menuitem1</A><IMG NAME="img1" SRC="empty.jpg">
нифига не понял.... если к примеру сама кнопка называется button.jpg и ссылается на index2.phpто как конструкция выглядеть будет ?
кстати, в php этот код менять как-нить надобно(в отличае от html) ?
когда сделал, то получилось что между картинками стояла тонеькая синяя линия подчёркивания... мне нужно чтобы сразу после одной картинки шла вторая, т.е. не пропуская ни одного пиксела
Гыхм...
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';">
тьфу, сорри, всё из-за моей невнимательности ))
разобрался в обоих случаях. с самого начала не увидел, что объекту даётся имя 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, но может и через яву как то можно ?
Reebok
Можно через яву - но это гемор - придется после загрузки страницы сканить массив ссылок и 1. удалять ненужную, 2. вставлять рядом с соответсвующей ссылкой ентот твой прямоугольник... Лучше в ПХП. Т.е. сразу формировать страницу без ссылки на пункте меню и с нужным рисунком.
пнятно, будем через пхп... а по поводу обводки синей в экспловере?
У рисунков? Поставь на них параметр BORDER="0":<IMG SRC="..." BORDER="0">
кул )))
вот чего получилось http://daband.nm.ru/java/
попозджя слева буду делать
vBulletin® v3.8.5, Copyright ©2000-2024, Jelsoft Enterprises Ltd.