Възпроизвеждане на звук, когато курсора на мишката до елемента

Ако направите заявка за търсачките по темата за възпроизвеждане на звук с използване на CSS, тогава вие ще откриете:

  1. Връзки към материали на Counter Strike: Source.
  2. Нещо за пиесата, по време на и щеката-преди и такива обещаващи моменти, но нищо конкретно за това, как да се публикува писък, когато задържите курсора на мишката върху елемента от менюто.

Звукът е част от дизайна и възможността да играете / работят звукови клипове, трябва да присъстват в CSS, но уви. тя все още. За да се възпроизвежда звук, когато курсора на мишката минава определена област, ние трябва да се разчита на HTML5 или Flash. Но кой в ​​днешно време искат да общуват с Flash? Ето защо, ние се обръщаме към HTML5, който може да играе на звука от своя елемент

Ако поставите по-горе код на страницата, не виждате или чувате. За да се покаже малък играч нужда да използвате контролите приписват (

Ние ще използваме JQuery, защото това значително улеснява избора и работи с елементите.

Това е кодът, който играе звук, когато мишката минава над отделен елемент:

Един пример от реалния живот

На Goodfoot сайт използва тази технология, за да играят различни звуци, когато мишката минава над устието на Голямата стъпка (работи в WebKit браузъри). Този ефект се прави чрез поставяне на нов елемент в структурата на аудио DOM всеки път, когато курсора на мишката минава над снежен човек в устата:

Методът може да бъде леко подобрена чрез добавянето на поддръжка за OGG файлове:

Друг начин да се постигне същия ефект - трябва да поставите множество звукови елементи на една страница:

И произволно избира една от се играе:

Проби и въпроси: налагане звуци.

На страницата демо реализира идеята за игра на тракане, когато мишката минава над елемент от менюто. Веднага се отваря на проблема: стартирането на следващия възпроизвеждане на звук с помощта на функцията за .play () ще се извършва преди края на предишния звук. Един аудио елемент може да възпроизвежда аудио от тавана. Ново искане за възпроизвеждане на функция .play () се игнорира до края на течаща звук.

Първата ми мисъл - първа употреба .pause (), за да спрете да играете и да стартира следващия игра .play () функция. Но изследване разкри липсата на този метод - се генерира пауза, но не започва нов звук в много случаи.

Най-добрият начин за решаване на проблема - да се дублира аудио компонент за всеки елемент от менюто. По този начин, независими елементи могат да играят аудио звуци припокриват.

Възпроизвеждане на звук, когато курсора на мишката до елемента
Възпроизвеждане на звук, когато курсора на мишката до елемента

Днес ние бихме искали да споделим няколко идеи за ефекта на блока е открит, който можете да използвате за техните проекти.

  • Ако искате да се увеличи значително сигурността на вашия сайт на WordPress, няма да избяга .htaccess конфигурацията на файла. Това не само ще се предпазите от редица хакерски атаки, но също така да се организират пренасочване, както и за решаване на проблемите, свързани с кеша.

  • Материал дизайн - тази тенденция набира скорост от Google. В тази колекция събра за свободни теми WordPress, изпълнени в този популярен стил.

  • Ефекти върху това и там, за да впечатлят посетителите ни. В тази колекция събра няколко десетки ресурс, чието създателите наистина се опита да впечатли своите посетители.

  • В края на месеца, ние предлагаме да се запознаете с набор от безплатни материали за уеб дизайнери в последния месец.

    клас благодаря за поста

    Възпроизвеждане на звук, когато курсора на мишката до елемента

    До получаване на информация от два канала (зрение и слух) на ефективността на обучението далеч по-добър живот от книги. А домашните задачи и онлайн тестове ще ви позволи да мисля постоянно в целевия език и веднага провери знанията си!

    Възпроизвеждане на звук, когато курсора на мишката до елемента

    Възпроизвеждане на звук, когато курсора на мишката до елемента

    Ако искате по-дълго време, за да проучи как да се HTML, че ме има, за което трябва добра новина!

    Възпроизвеждане на звук, когато курсора на мишката до елемента

    Ако вече сте се научили HTML и искат да се движи напред, следващата стъпка ще бъде да се проучи CSS технологията.

    Възпроизвеждане на звук, когато курсора на мишката до елемента

    Ако искате да се разбере концепцията на домейн и хостинг, да научат как да се създаде база данни, да качвате файлове към уеб сайт чрез FTP сървър, създаване на поддомейни, да конфигурирате пощенските кутии за сайта и мониторинг на посещаемостта, този курс е разработен специално за вас!