chanman

# February 11, 2013 at 6:00 pm

I realize this idea is totally outdated but my client wants it and what the client wants most of the time the client gets. I figured out how to put music on the site and it works great and is fast. what i’m wanting to know is there a way to when the site loads there is a popup which says there is music do they want it to play or not. Me and a friend have the popup kinda working but the music plays regardless of the popup. I’ll post the pen in a little bit.

chanman

# February 11, 2013 at 6:14 pm

The pen is here: http://cdpn.io/xIKFw
Sorry but I don’t have time to post the images so the css won’t work right. If you cant figure it out without them let me know and ill post them when I get a chance.

tomrogers123

# February 11, 2013 at 6:22 pm

It would be easy to give the user a warning using JavaScript. You could attach an event handler to the document and run this when it was ready:

window.confirm(“if you wish to continue music will stop playing”);

You could then write logic that. if they confirmed, would fire the audio playing (only if you have a JS API).

chanman

# February 11, 2013 at 6:27 pm

I don’t really know but just a little js so your probably going to have to do this in baby steps.

chrisburton

# February 11, 2013 at 7:35 pm

I would talk the client out of it. Just because the client likes it doesn’t mean majority of his user base will. And that’s what is important.

tomrogers123

# February 12, 2013 at 12:38 pm

Playing around, this JS seems to work:

var selection = window.confirm(‘This page has sound on it. Confirm to play’),
testTrack = document.getElementById(‘audio’);

if(selection == true) {
testTrack.load();
testTrack.play()
}

That doesn’t sort out your pause link quite yet (can add if needed), but it does make it so it will only start playing if they click OK at the confirmation. If you need anymore help let me know. Interestingly also, I couldn’t just update the codepen because confirm doesn’t seem to run.

I do kinda agree with @chrisburton too though in that having a big popup when the page loads is obtrusive and may hinder good UX. But hey, if that’s what you need that’s fine I guess :)

chanman

# February 12, 2013 at 12:46 pm

Thanks guys I’m probably going to try and talk him out of it but this would still be a good thing to know how to do.

tomrogers123

# February 12, 2013 at 12:57 pm

Smart move I think!

chrisburton

# February 12, 2013 at 5:50 pm

@tomrogers123 I disagree. I don’t think it’s “fine” to force a user to have to automatically get rid of an unnecessary popup. Especially every time you visit the site (unless he’s using a cookie).

@chanman Let us know what your client comes back with in case you need help convincing.

chanman

# February 13, 2013 at 9:02 am

@tomrogers123 where would I need to put that code in this code:

$(document).ready(function(){
var name = prompt(“Would you like to play background music?(yes or no)” );
var Audio = document.getElementById(‘audio’),
ctrl = document.getElementById(‘audio-controls’);
ctrl.onclick = function () {
var pause = ctrl.innerHTML === ‘pause’;
ctrl.innerHTML = pause ? ‘play’ : ‘pause’;
ctrl.className = pause ? ‘pause’ : ‘play’;

var method = pause ? ‘pause’ : ‘play’;
Audio[method]();

return false;
};
if(name === “yes”){$(document).ready();}
else{ctrl.onclick();}
});

Paulie_D

# February 13, 2013 at 10:05 am

>Just allow them to turn it off. That’s all you need

Nope…give them the option to turn it on….much better.

Paulie_D

# February 13, 2013 at 10:34 am

>Depending on the site. Sometimes it fits.

Strongly disagree. I surf… a lot…and I can’t think of a single site I have EVER visited that would benefit from having sound activated by default.

chanman

# February 13, 2013 at 10:45 am

@Eric my problem with it is what if somebody opens it up in there office or even better in the library and the speakers were left to high from the last person that’s going to scare them to death.

@paulie_d thanks for backing me up on this I think were totally right.

chanman

# February 13, 2013 at 10:53 am

@Eric ok i’ll agree but i think you have to think about what kind of song it is also and how loud it’s going to play on default.

Paulie_D

# February 13, 2013 at 10:56 am

One other thing….If you go down the route of NOT having sound by default then then the option should be given in a special section of the page (perhaps in the header or at the top of an aside) to say something like…”We have sound…click here to enable”.

I hate anything that pops up.