Для того чтобы HTML5 работал во всех Интернет Эксплорерах, начиная с 6-й версии, используйте яваскрипт html5shiv от Джонатана Нила.

Подключается он так:

<!--[if lt IE 9]>
	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

Напомню, что перейти на HTML5 совсем просто. Ну, и не забывайте делать сброс стилей.

Апдейт от 3 января 2012: В HTML 5 появился атрибут placeholder, который я бы советовал использовать чаще, чем пример ниже.
——

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

Заключается он в следующем: изначально в поле пишется какой-нибудь текст, например «Ваше имя». Когда мы подводим курсор чтобы ввести текст, то поле очищается, позволяя нам ввести наше имя, но если мы ничего не ввели и убрали «фокус» с текстового поля, то там опять пишется «Ваше имя».

Достигается такой эффект всего одной строкой, которую мы вставляем в тег input или textarea:

onFocus="if(this.value=='Ваше имя') this.value='';" onBlur="if(!this.value) this.value='Ваше имя';"

Важно чтобы текст в параметре value совпадал с задаваемым нами значением value в onFocus и onBlur. Если кто-то ничего не понял — смотрим пример :)


P. S. мой друг Константин Орленко разместил недавно статью о том как можно ограничить ввод только нужных символов. Читаем, просвещаемся.

Ну вот, как и обещал в прошлой записи, выкладываю заметку еще об одном сервисе от Yahoo!. На этот раз это будет интересный медиа плеер.

Почему интересный? Сейчас попробую объяснить...

Все дело в том, что подключается медиа плеер всего лишь одной строкой:

<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>

Затем выкладываем на странице MP3 файлы и далее скрипт автоматически считывает страницу на наличие музыкальных треков, превращая веб-страницы в плейлист. Также к каждой ссылке он подставляет значек со стрелочкой — «плей», которая меняется на знак «пауза» как только запущена песня. Еще раз повторюсь, что все это он делает сам! От вас нужно лишь разместить код, написанный выше. Как видите все очень просто! :)

Сам плеер располагается в левом нижнем углу экрана и разворачивается когда вы хотите послушать выложенные на странице песни:



Узнать о еще бОльших возможностях плеера от Yahoo! можно на официальной странице плеера.

Данный скрипт представляет собой способ сделать кнопку формы неактивной пока не поставлен флажек в «checkbox»:

<script type="text/javascript">
function apply()
{
	document.frm.sub.disabled=true;
	if(document.frm.chk.checked==true)
	{
		document.frm.sub.disabled=false;
	}
	if(document.frm.chk.checked==false)
	{
		document.frm.sub.enabled=false;
	}
}
</script>

Далее создаем форму:

<form name="frm">
	<input type="checkbox" name="chk" onClick="apply()"> Я согласен на условия.
	<input type="button" name="sub" value="Далее" disabled>
</form>

Пользуемся :)

Апдейт от 3 января 2012: Настоятельно рекомендую использовать выпадающий текст с помощью jQuery.
——

Поздравляю всех с прошедшими праздниками! Надеюсь, вы отлично отметили :) Сегодня я покажу вам маленькую фичу для сайта. Этот выпадающий текст при нажатии на ссылку очень может пригодиться для экономии места на сайте, особенно если текста много и его желательно показывать порциями...

Итак, у нас есть текст, который надо показывать только при нажатии на ссылку. Вставляем следующий код на сайт:

<span><a href="" onclick="
obj=this.parentNode.childNodes[1].style; 
tmp=(obj.display!='block') ? 'block' : 'none'; 
obj.display=tmp; 
return false;">Ссылка</a><div style='display: none'>
Большой и длинный текст :)</div></span>