HavaLite CMS

A new liteweight Content Management System (CMS)

jSound - jQuery plugin

JSound 1.0.1 is jQuery plugin for playing sounds on any html tag element

JSound works only on modern browser with html5. We always need 2 files as *.mp3 and *.ogg

We implement the jQuery framework and jsound plugin in the head part of our site as follow:

<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script language="javascript" src="jsound.js"></script>

First we open jsound.js and declare which tag elements should be used to play audio:

// here i'll use <a>, <p> and <input> tags
var soundElem = 'a, p, input';

Now we can use the jsound attributes in the defined tags:

<p startSound="country_day"></p>
<a href="#" hoverSound="beep">let the mouse path over me</a>
<input type="text" name="inputfield" focusInSound="space" focusOutSound="journey" />

// to stop all running sounds use the function stopSounds()
<a href="#" onClick="stopSounds();">Stop all sounds</a>

Here are all attributes

  1. startSound // starts sound when page is complete loaded
  2. loopSound // additional to startSound
  3. hoverSound
  4. leaveSound
  5. clickSound
  6. moveSound
  7. focusInSound
  8. focusOutSound

If you like to use the sound effect to a specified tag without typing the attributes every time, than you can change the allElems variable to TRUE in jsound.js

var soundElem = 'a';
var allElems = true;
var aHover = 'myHoverSound';
var aLeave = 'myLeaveSound';
var aClick = 'myClickSound';

 

See Demo          Download: jsound.zip

comments powered by Disqus

0 Comments

    Leave a Reply

    Contact Info

    Phone: +49 941 26175

    Address: Ayman Teryaki,
    Prüfeninger Str. 48,
    93047 Regensburg, Germany

    Want more info - go to our contact page or visit Google+

    Social

    Stay up to date. Subscribe via RSS, Facebook, Twitter or Email

    Recent Comments