{"id":86,"date":"2012-10-06T14:30:59","date_gmt":"2012-10-06T18:30:59","guid":{"rendered":"https:\/\/havalite.com\/?p=86"},"modified":"2023-01-24T13:08:51","modified_gmt":"2023-01-24T18:08:51","slug":"jsound-jquery-plugin","status":"publish","type":"post","link":"https:\/\/havalite.com\/?p=86","title":{"rendered":"jSound – jQuery plugin"},"content":{"rendered":"

JSound 1.0.1 <\/strong>is jQuery plugin for playing sounds on any HTML tag element<\/p>\n

JSound <\/strong>works only on modern browser with html5. We always need 2 files as *.mp3<\/strong> and *.ogg<\/strong><\/p>\n

We implement the jQuery framework and jsound plugin in the head part of our site as follow:<\/p>\n

<script language=\"javascript\" src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.6.2\/jquery.min.js\"><\/script>\r\n  <script language=\"javascript\" src=\"jsound.js\"><\/script>\r\n<\/pre>\n
First we open jsound.js and declare which tag elements should be used to play audio:<\/p>\n
\/\/ here I'll use <a>, <p> and <input> tags\r\n  var soundElem = 'a, p, input';\r\n<\/pre>\n
Now we can use the jsound attributes in the defined tags:<\/p>\n
<p startSound=\"country_day\"><\/p>\r\n  <a href=\"#\" hoverSound=\"beep\">let the mouse path over me<\/a>\r\n<\/pre>\n
<input type=\"text\" name=\"inputfield\" focusInSound=\"space\" focusOutSound=\"journey\" \/>\r\n  \r\n  \r\n\/\/ to stop all running sounds use the function stopSounds()\r\n<a href=\"#\" onClick=\"stopSounds();\">Stop all sounds<\/a>\r\n  \r\n<\/pre>\n
Here are all attributes<\/p>\n
    \n
  1. startSound <\/span>\/\/ starts sound when page is complete loaded<\/span><\/li>\n
  2. loopSound <\/span>\/\/ additional to startSound<\/span><\/li>\n
  3. hoverSound<\/span><\/li>\n
  4. leaveSound<\/span><\/li>\n
  5. clickSound<\/span><\/li>\n
  6. moveSound<\/span><\/li>\n
  7. focusInSound<\/span><\/li>\n
  8. focusOutSound<\/span><\/li>\n<\/ol>\n
    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<\/p>\n
    \n
    var soundElem = 'a';\r\nvar allElems = true;\r\nvar aHover = 'myHoverSound';\r\nvar aLeave = 'myLeaveSound';\r\nvar aClick = 'myClickSound';<\/pre>\n<\/blockquote>\n
    See Demo<\/big><\/a><\/span>\u00a0\u00a0\u00a0 \u00a0 \u00a0 \u00a0 Download: jsound.js<\/a><\/big><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"
    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 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[28,37,41,9,42,43,10,31,17,35,39,38,29,45,30,44,40,36],"class_list":["post-86","post","type-post","status-publish","format-standard","hentry","category-jquery-plugins","tag-audio","tag-buttons-effect","tag-click","tag-download","tag-focusin","tag-focusout","tag-free","tag-hover","tag-html5","tag-jquery-plugins","tag-leave","tag-move","tag-mp3","tag-music","tag-ogg","tag-onblur","tag-onclick","tag-sound"],"_links":{"self":[{"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts\/86","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=86"}],"version-history":[{"count":14,"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts\/86\/revisions"}],"predecessor-version":[{"id":545,"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts\/86\/revisions\/545"}],"wp:attachment":[{"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=86"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=86"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=86"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}