Резиновые кнопки с помощью button

3.10.2008

Категория: Веб-разработка

Итак… кнопочки.. небольшое исследование… у кого есть идеи – в комменты!!!

Есть много статей, описывающие техники стилизирования кнопок. Причём оформлять можно как ссылки, так и 2 вида кнопок: input type=»image» и button. Я предпочитаю использовать последнюю.

Многие пишут об удобности этого тега и пророчат великое будущее…

Трудно подобрать себе универсальную технику. В каждой есть свои минусы. Но будем стремиться к идеалу – меньше картинок, меньше лишних пустых тегов в коде!

А.. ещё… по поводу hover – видимо не везде можно избежать использования javascript :( и зум… тоже сильно не поиграешься, так увеличение на 1-2 размера шрифта ещё прокатит, а дальше болт :(

Ознакомлю с видами оформления:

1) «sliding doors» – развижные двери двумя картинками + span.
Хотелось бы отметить сложность использования в Опере (в ИЕ6-7 тоже, но можно пофиксить с помощью CSS) – при клике на кнопке её контент сдвигается и кнопка кажется «поломанной» :(

2) Двери, только одной картинкой + span. Идея ничего так, вот только снова для ссылок и input сделали. Про button забыли :(
Не проблема – подшаманим сами! Или проблема? Фак! :)
Меняем немного код и всё работает вроде :)

Под ИЕ пофиксили нажатие кнопки, а Опера всё ещё глючит. Делаем вывод, что картинки нужно убирать с button и применять ниже, например добавив ещё один span. Этот метод последнее время и использую…

Продолжение следует!

, ,

Submit формы в новом окне

29.11.2005

Категория: Веб-разработка

Искал давеча способ, позволяющий при нажатии кнопки «Submit» в форме, открыть её в новом окне. Нашёл, универсальный, т.к можно для popup окна задать все нужные параметры. Для начала в < head > надо вставить код:

1
2
3
4
5
6
7
8
9
10
11

<script type="text/javascript">
/*
Form2Pop Script- By Peter Bailey (http://www.peterbailey.net)
Featured on JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
*/
function createTarget(t){
window.open("", t, "width=600,height=550");
return true;
}
</script>

А после подправить код в самой форме:

1
2
3
4

<form name="sampleform" method="POST"
action="/cgi-bin/formsubmit.pl" 
onsubmit="return createTarget(this.target)"
target="formtarget"></form>
, ,