Page 6 of 6 FirstFirst ... 456
Results 51 to 56 of 56

Thread: Changing background color AND playing a sound file on click

  1. #51
    Join Date
    Aug 2010
    Posts
    67
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Just a further update. I tried loading demo11 (the integrated version) into Phone Gap Build then downloaded to my droid. It displayed correctly but failed to play any sound - which was the reason I gave up on it previously as PGB support said I had to use their API for sound and this was the one you saw originally that used Silverlight.

    Just fyi.

    Tony

  2. #52
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,076
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    If silverlight works, use it.

    I was just wondering, because I remembered about having just one index file and you mentioned it again, if having an iframe would work. If so, you could use a standalone page for the sound without jQuery mobile on it and have it show through onto the main page via an iframe. That would greatly reduce the chance of a conflict with jQuery mobile, which could still be used on the index page. The sound page would of course have to be in the same folder. If that can work, it would be a good solution. Setting the proper width and height for the iframe might be tricky. But since you should know what those requirements are, it shouldn't be too hard. Something like:

    HTML Code:
    <iframe src="sounds.htm" width="100%" height=500 scrolling="no"></iframe>
    On the page in the iframe, set the body and/or html to overflow hidden. That in combination with the scrolling no attribute will get rid of any scrollbars on it, making it look more like part of the top page. Or you can use just overflow-x hidden to allow for a vertical scrollbar if/when needed.

    This all assumes that an iframe is allowed for this sort of thing you're doing and will work. But if so, it's one of the best way to avoid script and css conflicts while still having only one page. An object tag can also be used to show one page in another. It's less reliable cross browser (older IE and Opera act weird with it), but should work on mobiles and tablets. If an object tag is used, the syntax is different.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #53
    Join Date
    Aug 2010
    Posts
    67
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    Thanks, no response from Intel XDK support yet on this problem, I've also posted a question in the jQuery Mobile forum asking if anyone else has used the Dreamweaver CS6 Sample with Intel XDK New successfully. Somehow I doubt it. Anyway I'm now trying to learn more about the JQM structure and have found some good, I think, documentation on jquerymobile.com. I'll try absorbing this and also try the Intel XDK test features some of which supposedly log everything that happens so I'll see what I can figure out.
    One question on Silverlight - when we started this journey you were concerned that Silverlight may not be implemented on some phones - sorry if I'm not quoting you exactly, but to get around this we used jPlayer for maximum compatibility so I'm a bit reluctant to go back to Silverlight - which appeared when I used Phone Gap Build to convert my web app to a mobile app. From my latest test I know that PGB can correctly display the JQM menu and page structure so perhaps I should look harder at the Silverlight issue.
    I'm a bit tied up the rest of Wednesday, I'll get back to you as soon as I can.
    Thanks again,

    Tony

  4. #54
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,076
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    What about the iframe option?

    Also, on silverlight, it's my impression that once the app is compiled, it incorporates all of the resources. That might make each individual user not have to have silverlight, but probably not. It's a browser not a script plugin. You could require it though.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #55
    Join Date
    Aug 2010
    Posts
    67
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    I'm really new to this js stuff and apart from copying a couple of YouTube Embedded videos have never used iFrames. I don't know what the pros and cons are. However, I did receive a reply from Intel Tech Support, you can see it here https://forums.html5dev-software.int...hp?f=34&t=4459 . Basically they said there's a bunch of CSS and js I need to insert in the index.html file. I would have thought the XDK should do that automatically, and certainly I haven't seen a mention of it anywhere in their documentation. Anyway, I'll try that next (first with the very simple demo12 and if that works with demo11, I'll report back.
    regarding Silverlight, I don't know if's included by PGB or if it assumes it's installed and it just happened to be installed on my droid. It won't be an issue if the Intel XDK works.

    Just fyi I signed up for a 3 day conference on html5 development in San Francisco next month including a full day on jQuery Mobile, hopefully some of this will become clearer to me then.
    Tony

  6. #56
    Join Date
    Aug 2010
    Posts
    67
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John,

    I got it working - with one minor glitch.

    The advice from the Intel folks didn't make sense to me - he said I had to add additional lines etc before uploading to the Intel XDK New. This wasn't documented anywhere else in the XDK. Sooo, I ignored it and rebuilt demo12 - this was the sample JQM template from Dreamweaver CS6 with absolutely no changes. I uploaded to XDK and tried it in their emulator and it worked, so I built the mobile app and downloaded to my droid phone and that worked too. This can be seen at www.lawenforcementspanish.com/demo12 . Basically this just navigates between the various "pages".

    Next I integrated the code you gave me to play sounds with jPlayer and change the background color while playing the sound, I uploaded to the XDK and downloaded to my droid phone (the XDK can't play mp3 sounds in emulator mode) and it worked. This can be seen here www.lawenforcementspanish.com/demo14 .

    The only minor glitch is that after a sound has played the background color goes to white instead of the original grey color. This didn't happen in the previous versions I tried. I didn't knowingly change anything, I'd appreciate your advice on this.

    When the color issue is fixed I'll leave demo14 on the website so others can see a working copy as this seems to be a popular topic.

    Thanks again for walking me through this, I couldn't have got this far without your assistance.

    Tony

Similar Threads

  1. Problem playing sound file in Opera !
    By spazzer in forum HTML
    Replies: 1
    Last Post: 03-11-2010, 01:51 AM
  2. Button sound for Rollover background-color buttonuttons
    By egghead2000 in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 02-03-2010, 10:14 PM
  3. Changing Text and Background Color
    By Steve Wilbanks in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 01-16-2010, 12:10 PM
  4. tab menu item color not changing on click
    By ashok_kuncha in forum CSS
    Replies: 0
    Last Post: 08-14-2007, 09:41 AM
  5. Swith Content: Changing background-color
    By abbeyvet in forum Dynamic Drive scripts help
    Replies: 5
    Last Post: 05-08-2007, 02:42 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •