Помогите по html)

Уработался совсем) заклинело на сделать кнопку картинку чтоб при на ведении менялась) помню раньше делал кнопки такие давно, просто было как два пальца..., в самом теге ссылки, вроде, писалось что-то, забыл((
полез гугл , яндекс, везде одно и тоже - решение с яваскриптом.
Так и ненашел обычный старый способ с html.
МОжет кто помнит?)))

есть такое решение

Код:

<!-- CSS --> input.btn {    width: 100px;    height: 25px;    background: url(img.jpg); } input.btn:hover {    background: url(img_over.jpg); } <!-- HTML --> <form> <input type="image" class="btn" src="s.gif" value="button" /> </form>

где s.gif это однопиксельный 1х1 прозрачный гиф

Код:

<a href="#" onmouseover="img1.src='images/btn1.jpg'"onmouseout="img1.src='images/btn.jpg'"><img src="images/btn.jpg" alt="" width="120" height="60" border="0" name="img1" onload="tempImg=new Image(0,0); tempImg.src='images/btn.jpg'"></a>

Такое надо?

Otchenash писал:

Код: <a href="#" onmouseover="img1.src='images/btn1.jpg'"onmouseout="img1.src='images/btn.jpg'"><img src="images/btn.jpg" alt="" width="120" height="60" border="0" name="img1" onload="tempImg=new Image(0,0); tempImg.src='images/btn.jpg'"></a> Такое надо?

не там всё проще было.
попробовал этот - работает ткоа одна кнопка когда делаеш вторую обе отказывают)

в каждой следующей меняй img1 на img2, img3, ....., imgN, и всё заработает. Пользовался этим способом, когда еще флэша в помине не было. Самый простой способ насколько знаю.

можно например так

стили:
a {width: 200px ; display: block; background: url(image1.jpg) no-repeat center top;}
a:hover {background: url(image2.jpg) no-repeat center top;}

в теле документа
<a href="">Кнопка</a>

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

для бэкграунда можно вместо no-repeat center top указывать то что нужно, например если картинка повторяется по вертикали repeat-y и так далее

можешь вообще "Кнопка" в ссылке не писать, но в стилях указать ширину и высоту ссылки

сколько разный способов CSS.
что никто не понит старый добры штмл способ?)

там без всяких переменных, тупо указывалась одна картинка и вторая в теле тега ссылки.

бля, я уже начинаю думать что мне это приснилось))

Делаю аки Петек, штмл способа - не знаю..

html без css и js полностью статичен. Чем тебя ксс не устраивает? Он не отключается как js.

Цитата:

html без css и js полностью статичен.

Зря ты так Помоему мой пример как раз тому подтверждение. А еще средствами хтмл текст сам двигается, что тоже не статика совсем. Наверное ты имел ввиду всётаки не статичность ,а неинтерактивность, хотя onmouseover в теге "а" уже обеспечивает эту самую интерактивность.

я конечно могу ошибаться, но onmouseover - уже скриптом считается...вроде=)

Может гдето и считается (что естественно, ведь это всё-таки обработка события), но в чистом хтмле это обрабатывается без всяких <скрипт>, просто в теге <а>.

да? ... а теперь отключи javascript и посмотри как оно будет работать. Твой пример полностью сделан на javascript.

Хз как насчет javascript, но я так делал еще в девяностых, когда про яву слыхом не слыхивал.

сделал в итоге по примеру Petek и wMaster, с прозрачным гифом, но гемор это имхо). так никто и не вспомнил старый простой способ сделать на хтмл кнопку).

вопрос остается открытым) - ради интереса)

Мне кажется что за давностью времени у тебя уже исказилось воспоминание.

Otchenash писал:

Хз как насчет javascript, но я так делал еще в девяностых, когда про яву слыхом не слыхивал.

ява бесспорно - оптимальный вариант

Otchenash писал:

Хз как насчет javascript, но я так делал еще в девяностых, когда про яву слыхом не слыхивал

ХЗ помойму ты путаешь педали
javascript - это javascript
java - это java

незнаю как там с java в 90-х а вот, javascript тогда уже юзали, и пополной

у Otchenash нормальный пример, то что нужно как по мне

Код:

<a href="http://google.com.ua/" onmouseover="document.button.src='about24.bmp';" onmouseout="document.button.src='about24_d.bmp';"> <img name="button" border="0" src="about24_d.bmp" width="24" height="24"></a>

проверял работает и в ослике и в файрфоксе