Note that there are some explanatory texts on larger screens.

plurals
  1. POAudio script stopped working when I switched to div pages
    primarykey
    data
    text
    <p>Thanks for looking.</p> <p>I am not a programmer and have just managed to cobble together a simple proof-of-principle "app" (using a bit of html, jquery and javascript) with a few pages, a bit of text, an image and an audio snippet. </p> <p>However, I also needed to swipe from one page to another and was having problems making this work with separate html files. Finally I managed to get swiping working nicely (hurrah) by using 3 'pages' all in one index file but then the audio broke (boo) - note: it worked perfectly in separate html files. </p> <p>I figured that there must be a problem with three identical audio scripts (one on each 'page') having the same function name, so I changed them to be unique. It still didn't work. I tried changing the <em>var</em> name too, No dice.</p> <p>Can anyone suggest a tweak that would fix it? I am sure it's quite simple but I am stuck.</p> <p>Here's my index page:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; &lt;title&gt;HELLO&lt;/title&gt; &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile- 1.2.1.min.css" /&gt; &lt;script src="http://code.jquery.com/jquery-1.8.3.min.js"&gt;&lt;/script&gt; &lt;script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"&gt;&lt;/script&gt; &lt;!-- set page swipes --&gt; &lt;script&gt; &lt;!-- $('div.ui-page').live("swipeleft", function(){ var nextpage = $(this).next('div[data-role="page"]'); if (nextpage.length &gt; 0) { $.mobile.changePage(nextpage, "slide", false, true); } }); $('div.ui-page').live("swiperight", function(){ var prevpage = $(this).prev('div[data-role="page"]'); if (prevpage.length &gt; 0) { $.mobile.changePage(prevpage, {transition: "slide", reverse: true}, true, true); } }); // --&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;!-- Page 1 --&gt; &lt;div data-role="page" id="home"&gt; &lt;div data-role="header" data-theme="b"&gt; &lt;h1&gt;Bok!&lt;/h1&gt; &lt;/div&gt;&lt;!-- /header --&gt; &lt;div data-role="content" align="center"&gt; &lt;img src="Aron_pic.png" width="170" height="170" alt="Lovely boy"&gt;&lt;/a&gt;&lt;br&gt; &lt;br&gt;&lt;br&gt; &lt;!-- audio script --&gt; &lt;button onclick="playHi('hi.mp3')"&gt;Hi!&lt;/button&gt; &lt;script src="phonegap.js"&gt;&lt;/script&gt; &lt;script&gt; function playHi(src) { if (device.platform == 'Android') { src = '/android_asset/www/' + src; } var media = new Media(src, success, error_error); media.play(); } function success() { // ignore } function error_error(e) { alert('Error: check URL'); alert(e.message); } &lt;/script&gt; &lt;!-- ???? --&gt; &lt;/div&gt;&lt;!-- /end body content --&gt; &lt;/div&gt;&lt;!-- /end page 1 --&gt; &lt;!-- page 2 --&gt; &lt;div data-role="page" id="goodbye"&gt; &lt;div data-role="header" data-theme="b"&gt; &lt;h1&gt;Dovizenja!&lt;/h1&gt; &lt;/div&gt; &lt;div data-role="content" align="center"&gt; &lt;img src="Aron_pic.png" width="170" height="170" alt="Lovely boy"&gt;&lt;/a&gt;&lt;br&gt; &lt;br&gt;&lt;br&gt; &lt;!-- AUDIO FUNCTION --&gt; &lt;button onclick="playBye('goodbye.mp3')"&gt;Goodbye!&lt;/button&gt; &lt;script src="phonegap.js"&gt;&lt;/script&gt; &lt;script&gt; function playBye(src) { if (device.platform == 'Android') { src = '/android_asset/www/' + src; } var media = new Media(src, success, error_error); media.play(); } function success() { // ignore } function error_error(e) { alert('Error: check URL'); alert(e.message); } &lt;/script&gt; &lt;/div&gt;&lt;!-- / end body content --&gt; &lt;/div&gt;&lt;!-- /end page 2 --&gt; &lt;!-- new page 3 --&gt; &lt;div data-role="page" id="thankyou"&gt; &lt;div data-role="header" data-theme="b"&gt; &lt;h1&gt;Hvala!&lt;/h1&gt; &lt;/div&gt; &lt;div data-role="content" align="center"&gt; &lt;img src="Aron_pic.png" width="170" height="170" alt="Lovely boy"&gt;&lt;/a&gt;&lt;br&gt; &lt;br&gt;&lt;br&gt; &lt;!-- AUDIO FUNCTION --&gt; &lt;button onclick="playThanks('thankyou.mp3')"&gt;Thank you!&lt;/button&gt; &lt;script src="phonegap.js"&gt;&lt;/script&gt; &lt;script&gt; function playThanks(src) { if (device.platform == 'Android') { src = '/android_asset/www/' + src; } var media = new Media(src, success, error_error); media.play(); } function success() { // ignore } function error_error(e) { alert('Error: check URL'); alert(e.message); } &lt;/script&gt; &lt;/div&gt;&lt;!-- / end body content --&gt; &lt;/div&gt;&lt;!-- /end page 3 --&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload