Help please? Not sure why JPlayer not working on my website

921 views
Skip to first unread message

rustysedam

unread,
Aug 9, 2011, 10:48:16 PM8/9/11
to jPlayer: HTML5 Audio & Video for jQuery
I carefully used the quick start guide on your site to enter what I
thought was the proper code for my website.

The player shows up on my page, but the music will not play. Can
someone look at the code below and tell me what I'm doing wrong??

I use GoDaddy.com as a host...maybe they're not compatible or
something?

<html>
<head>
<link type="text/css" href="/skin/jplayer.blue.monday.css"
rel="stylesheet" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.jplayer.min.js"></
script>
<script type="text/javascript">
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3: "http://www.rockinrusty.com/music/01-
five_finger_death_punch-over_and_under_it1.mp3"
});
},
swfPath: "/js",
supplied: "mp3"
});
});
</script>
</head>
<body>
<div id="jquery_jplayer_1" class="jp-jplayer"></div>
<div class="jp-audio">
<div class="jp-type-single">
<div id="jp_interface_1" class="jp-interface">
<ul class="jp-controls">
<li><a href="#" class="jp-play" tabindex="1">play</a></li>
<li><a href="#" class="jp-pause" tabindex="1">pause</a></li>
<li><a href="#" class="jp-stop" tabindex="1">stop</a></li>
<li><a href="#" class="jp-mute" tabindex="1">mute</a></li>
<li><a href="#" class="jp-unmute" tabindex="1">unmute</a></
li>
</ul>
<div class="jp-progress">
<div class="jp-seek-bar">
<div class="jp-play-bar"></div>
</div>
</div>
<div class="jp-volume-bar">
<div class="jp-volume-bar-value"></div>
</div>
<div class="jp-current-time"></div>
<div class="jp-duration"></div>
</div>
<div id="jp_playlist_1" class="jp-playlist">
<ul>
<li>F5DP - "Under & Over It" (single)</li>
</ul>
</div>
</div>
</div>
</body>
</html>

</center>

SunSparc

unread,
Aug 9, 2011, 11:13:44 PM8/9/11
to jpl...@googlegroups.com
After I fixed the carriage returns that were breaking lines, which I assume is just from your pasting it, it worked for me in Chrome and Safari on a Mac.  However, it would not work in FireFox for me.  Though it also did not throw any JS errors either.

rustysedam

unread,
Aug 9, 2011, 11:29:45 PM8/9/11
to jPlayer: HTML5 Audio & Video for jQuery
It's not working for me in IE8, Firefox, or on my iPhone mobile
Safari. It's giving JS errors in IE8.

I'm looking for some kind of audio media player (mp3 mostly) that will
play universally on most any smart phone or desktop web browser.

rustysedam

unread,
Aug 9, 2011, 11:42:30 PM8/9/11
to jPlayer: HTML5 Audio & Video for jQuery
By the way, the example player on the JPlayer.org website at the end
of the quick start guide plays in IE8, & Firefox, & iPhone mobile
safari.

All I did was copy & paste the code, changed the line referring to
JPlayer audio file to mine and changed the media supplied type from
M4A & OGA to MP3 since I'm using an mp3.

Not sure what else I could've done wrong unless GoDaddy.com doesn't
support this.

Mark Panaghiston

unread,
Aug 10, 2011, 9:59:14 AM8/10/11
to jpl...@googlegroups.com
Going to your MP3 URL gives a 404 error:
http://www.rockinrusty.com/music/01-five_finger_death_punch-over_and_under_it1.mp3

Getting that correct is the first step. I do not see anything else wrong at the moment.

rustysedam

unread,
Aug 10, 2011, 6:17:20 PM8/10/11
to jPlayer: HTML5 Audio & Video for jQuery
Oh, sorry, I tried shortening the name of the mp3 to see if that was
the problem. I actually copied your code exactly using the M4A and
OGG examply files that were posted to jplayer.org in the audio
example summary and put it on my website...not even those would play,
so I'm guessing it's a problem with GoDaddy.com's hosting.

Here's the new code with corrected URL that I'd like on my site:

<center>
<br>
<br>
<body bgcolor="#000000">
<center><img src="http://www.rockinrusty.com/pics/FFDP-single.jpg"
width="300" height="300" alt="" border="0">
<br><center>
<font color="#FFFF00"><font size="5">Five Finger Death Punch <br>
"Under & Over It" (single) <br>
From the forthcoming album "American Capitalist" <br>
Release Date: October 11, 2011 <br>
</span>
<br>
<html>
<head>
<link type="text/css" href="/skin/jplayer.blue.monday.css"
rel="stylesheet" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.jplayer.min.js"></
script>
<script type="text/javascript">
$(document).ready(function(){
$("#jquery_jplayer_1").jPlayer({
ready: function () {
$(this).jPlayer("setMedia", {
mp3: "http://www.rockinrusty.com/music/01-5fdp-
over_and_under_it1.mp3"
}).jPlayer("play");
},
ended: function (event) {
$(this).jPlayer("play");
},
swfPath: "/js",
supplied: "mp3"
});
On Aug 10, 9:59 am, Mark Panaghiston <mark.panaghis...@gmail.com>
wrote:
> Going to your MP3 URL gives a 404 error:http://www.rockinrusty.com/music/01-five_finger_death_punch-over_and_...

Mark Panaghiston

unread,
Aug 11, 2011, 9:24:40 AM8/11/11
to jpl...@googlegroups.com
Please post the url of your project on your website. It is a billion times more useful than slapping 100 lines of code in an email.

rustysedam

unread,
Aug 16, 2011, 10:32:33 PM8/16/11
to jPlayer: HTML5 Audio & Video for jQuery
http://www.rockinrusty.com/music3.html

On Aug 11, 9:24 am, Mark Panaghiston <mark.panaghis...@gmail.com>
wrote:

Onyx

unread,
Aug 16, 2011, 11:16:13 PM8/16/11
to jpl...@googlegroups.com
Your jquery.jplayer.min.js file is not found where it is specified.  This URL returns a 404: http://www.rockinrusty.com/js/jquery.jplayer.min.js

--
You received this message because you are subscribed to the Google Groups "jPlayer: HTML5 Audio & Video for jQuery" group.
To post to this group, send email to jpl...@googlegroups.com.
To unsubscribe from this group, send email to jplayer+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/jplayer?hl=en.


Mark Panaghiston

unread,
Aug 17, 2011, 9:44:47 AM8/17/11
to jpl...@googlegroups.com
I also found that your JavaScript is missing. I assume that the Jplayer.swf file is missing too, so remember to upload them both to your /js folder.

I looked at your HTML by accident... FireBug just so happen to display it for me as I checked other stuff and it looks really bad. You have it badly formed, with you <body> being the main container and then having the <html> and <head> inside it... Oh and yet another <body> in it... And then lots of missing closing tags. I could go on... missing !DOCTYPE, using HTML outside the body, like <center>.

I suggest that you cut the stuff you put at the top out and move it down into the <body> further down. And remove your <body> tag too.

You probably want to check out some HTML tutorials on the web. There are probably millions if you do a search. Here is a good starting point:
http://www.w3schools.com/html/default.asp

rustysedam

unread,
Aug 23, 2011, 8:50:55 PM8/23/11
to jPlayer: HTML5 Audio & Video for jQuery
Well, I found my issue thanks to you. I named the directory I put the
player in as JP instead of JS, and of course the code I copied and
pasted from the website has it as JS. Lol.
I am new to HTML stuff and re-wrote the code and it worked fine on my
website. I'm sure it's not done perfectly, but it works.

Here's the result if you'd like to see:
http://www.rockinrusty.com/music_test.html

I'd really like the simple "Play" button you have on the main page of
jplayer.org & wish I knew how to put it onto my page with a volume
slider or to figure out how to make the Blue Monday player smaller.

The JPlayer was very helpful to me in finding a solution for letting
people visit my site from a PC or mobile smart phone and to be able to
play the music universally no matter which device they visit from.
Thank you.



On Aug 17, 9:44 am, Mark Panaghiston <mark.panaghis...@gmail.com>
wrote:
Reply all
Reply to author
Forward
0 new messages