Welcome to TalkGraphics.com
Page 3 of 3 FirstFirst 123
Results 21 to 27 of 27

Thread: Media Player

  1. #21
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,740

    Default Re: Media Player

    Many steps forward in the learning curve for me, but now hit a wall and here I am, cap in hand, crawling back for help.

    I can get the players to play tracks wherever I want to put the mp3s
    I am confident enough to change the look of the players
    I've moved the script from the Page Head to a Placeholder Head and all's well

    I just can't get 2 placeholders to work on the same page. Acorn mentioned having different IDs and Names for each 'block' of players, but I can't figure out what to rename.

    Attached: as far as I've got after hours of renaming various parts of the script. I accidently made some very strange looking players along the way
    Attached Files Attached Files

  2. #22
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,740

    Default Re: Media Player

    Another method that nearly works, but not really.

    I created the second block of players on a separate page simply by copy and paste then changing the path to the tracks.
    I then slapped a placeholder on the main page and made it an iFrame to the second page. It worked (as I presumed it would) but of course, the second block doesn't stop the first block from playing and vice versa.

    All this works perfectly if used on separate pages, I'm just making life more complicated than it is.

    Attached, part 3: The yellow rectangle is to cover the player background graphics.
    Audio Players3.web

  3. #23
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,740

    Default Re: Media Player

    Small update.

    I've discovered that on the second page 'player2' it still works if you delete everything except the placeholder and the text 'usesjquery'.
    It will fail to work in preview mode as I don't know how to point to page 'player2', so I published the site and used the full URL. My ignorance showing through.

  4. #24
    Join Date
    Mar 2019
    Posts
    1

    Default Re: Media Player

    Can someone just tell me how I can get a sound file to play when someone clicks on a picture? I know this is the wrong place to pose this question, but I cannot see how to start a thread.

  5. #25
    Join Date
    Dec 2018
    Location
    Australia
    Posts
    1,740

    Default Re: Media Player

    An elegant answer is to have the controls available for the visitor.

    Clone your picture (ctrl+k)
    Right click the clone and choose 'Web Properties'
    Click 'Placeholder' > 'HTML Code (Body)' and paste the following code

    <audio style="width:500px;height:60px" controls>
    * * <source src="PATH TO YOUR AUDIO FILE.mp3" type="audio/mpeg">
    Your browser does not support the audio element.
    </audio>

    The results look like the image below.
    Click image for larger version. 

Name:	Player.png 
Views:	117 
Size:	201.1 KB 
ID:	123622

  6. #26
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,748

    Default Re: Media Player

    Quote Originally Posted by Rychard View Post
    Can someone just tell me how I can get a sound file to play when someone clicks on a picture? I know this is the wrong place to pose this question, but I cannot see how to start a thread.
    Click on the required Forum link. Near the top is a Post New Thread button.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  7. #27
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,748

    Default Re: Media Player

    Quote Originally Posted by Chris M View Post
    An elegant answer is to have the controls available for the visitor.

    Clone your picture (ctrl+k)
    Right click the clone and choose 'Web Properties'
    Click 'Placeholder' > 'HTML Code (Body)' and paste the following code

    <audio style="width:500px;height:60px" controls>
    * * <source src="PATH TO YOUR AUDIO FILE.mp3" type="audio/mpeg">
    Your browser does not support the audio element.
    </audio>

    The results look like the image below.
    Click image for larger version. 

Name:	Player.png 
Views:	117 
Size:	201.1 KB 
ID:	123622
    Chris, my approach is a complete flip to yours.
    Drag and drop your mp3 onto the design page and accept the Do not Autostart option.
    This creates your audio controls placeholder.
    In the body code of the placeholder include the phrase id="songX"
    <audio id="weapon" class="xar_meplayer" id="songX" src="index_htm_files/chooseyourweapon.mp3" controls width = "100%" height="100%"/>
    On the image, add a Link:
    javascript: document.getElementById("songX").play();
    "songX" can be any phrase, just ensure it is the same in the control and the link.

    Clicking the actual image starts the audio.

    Other shapes can have .pause() or .stop() and the audio control can be then hidden away.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

 

 

Tags for this Thread

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
  •