I want to do my own jwplayer6 skin. I found some tutorials on official pages, but it doesn't work for me. I gues, I have a mistake somewhere. I found that I have to do my own XML file where I have to define the skin. I download custom jwplayer6 skin in XML format and I edit it and link into my script on my webpages. The source is here.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jwplayer.js"></script>
<script type="text/javascript">jwplayer.key="LJ2OdmUWFU9huxlX+xQ47geW5DeqsVTFce3RZg==";</script>
</head>
<body>
<div id="myElement">Loading the player...</div>
<script type="text/javascript">
jwplayer("myElement").setup({
file: "song.mp3",
skin: "skin/six.xml"
});
</script>
</body>
</html>
I edited the original XML to do some changes in skin, but it didn't work, so I totally deleted all unneeded XML tags, but the player is still the same, so I haven't got any idea, how to make my own skin. Any idea? Here is the live preview.
Related
first post..
trying javascript for first time.
i am following a book , created two files in the same directory
test_js.html
helloWorld.js
Contents of both are below:
test_js.html
<html>
<head>
<title> First Javascript page </title>
<script type="text/javascript" src="helloWorld.js"></script>
</head>
<body></body>
</html>
helloWorld.js
<script type="text/javascript">
alert("hello");
</script>
I dont see any alert when i load the html page.
However if i embed the same alert("hello") in the html page, i am seeing the alert being displayed.
Tried this on chrome and firefox (both latest) with same result.
Following googled examples is not showing any error in any of the files.
Please help.
remove script tags from helloWorld.js
just
alert("hello");
I'm new in using javascript and html.
I've been following a tutorial that involves loading files from the Paperjs code library. I'm trying to load a js file that contains functions and objects for placing images on web pages.
Whenever I attempt to load the "paper-full.js" file, I get a 404 error in the Console, despite the "paper-full.js" file being in the same location as the "index.html" file that's calling for it. The preview page also has the localhost IP address as the page's title, rather than the file name.
The goal for this part of the tutorial is just to place an image at [0,0] on the preview page.
Any ideas on where the mistake could be will be greatly appreciated.
folder containing the paper-full and index files
preview page error for index.html
Here is the index.html file
<!DOCTYPE html>
<html>
<head>
<!-- Imports the Paper.js library -->
<script type="text/javascript" src="js/paper-full.js">
</script>
<!-- Connects Paper.js with the HTML canvas -->
<script type="text/paperscript" src="js/rocket.js" canvas="canvas"></script>
</head>
<body>
<canvas id="canvas" width="800" height="800"></canvas>
</body>
</html>
Looking at your project structure you have your paper-full.js and rocket.js files alongside your index.html file, but you are looking for them inside a /js/ folder that doesn't exist.
Try this, noting how I have changed js/etc to ./etc, meaning it will look for it's neighboring file.
<!DOCTYPE html>
<html>
<head>
<!-- Imports the Paper.js library -->
<script type="text/javascript" src="./paper-full.js">
</script>
<!-- Connects Paper.js with the HTML canvas -->
<script type="text/paperscript" src="./rocket.js" canvas="canvas"></script>
</head>
<body>
<canvas id="canvas" width="800" height="800"></canvas>
</body>
</html>
I spent a few hours over the last few days reworking some of my javascript files so they could all be loaded toward the end of my source code (or, if they must be placed earlier, they would wait for jQuery to be defined, which is loaded in the footer but is required by most of my scripts). I then moved all scripts that could be moved to end of the source code.
So a rough example of the change..
Original:
<html>
<head>
<title>This is still an awesome web page</title>
<script type="text/javascript" src="/path/to/script.js"></script>
<script type="text/javascript" src="//www.example.com/path/to/another/script.js"></script>
<script type="text/javascript" src="/path/to/jQuery/or/some/other/important/library.js"></script>
</head>
<body>
<p>lots of great content</p>
<script type="text/javascript" src="/this/script/must/be/located/in/the/body.js"></script>
<p>more great content</p>
</body>
</html>
Updated:
<html>
<head>
<title>This is an awesome web page</title>
</head>
<body>
<p>lots of great content and maybe lots of images too</p>
<script type="text/javascript" src="/this/script/must/be/located/in/the/body.js"></script>
<p>more great content</p>
<script type="text/javascript" src="/path/to/script.js"></script>
<script type="text/javascript" src="//www.example.com/path/to/another/script.js"></script>
<script type="text/javascript" src="/path/to/jQuery/or/some/other/important/library.js"></script>
</body>
</html>
So I made that change and looked at Chrome's Network traffic when I reloaded some pages. I was surprised to discover that Chrome still loads my javascripts before loading images and such.
I did some reading and it seems like this is due to Chrome's preloader (https://plus.google.com/+IlyaGrigorik/posts/8AwRUE7wqAE) scanning ahead and loading important files sooner.
If Chrome (and other modern browsers I assume) are going to do this, then is there any reason to continue placing javascripts toward the end of the source code?
You'll want to place your scripts at the end of your HTML if;
1 - Your scripts need access to DOM/CSSOM nodes, therefore they have to be parsed prior to your JS.
2 - You want to display the page while the JS is still downloading and executing against the page.
I'm currently working on a portfolio website. And I came into a problem while scripting my java code. I tried to troubleshoot for hours on end but to no avail. Then I just decided to make the simplest code to see if it was just me that was being a total idiot. Here is the code:
$(document).ready(function() {
$("p").hide();
$("h1").click(function(){
$(this).next().slideToggle(300);
});
});
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Hi.</h1>
<p>How are you?</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jtest.js"></script>
</body>
</html>
Any help??? Maybe I'm just linking it to the HTML wrong or something. It might just be a simple solution I'm not figuring out.
Check make sure your browser has JavaScript Engine turned on.
Make sure you include all the files name correctly.
Put scripts inside head tab
Sometimes Internet Explorer disables scripts from running it gives you a warning
I am having a trouble with figuring out what "this spsefic outcome" in Google PageSpeed Test actually mean.
I am testing this website: www.loaistudio.com - https://developers.google.com/speed/pagespeed/insights/?url=www.loaistudio.com
Can anyone advice me please? I have managed to fix all of the other errors - but I am completely stuck at this one, I understand that CSS has to be in the head of the page, is this telling not to place it in the head but at the end of the page?!
Your browser freezes page rendering while loading JavaScript
Quick answer: you just have to put your JavaScript src below your content.
Why? Because when your browser begins loading JavaScript, it freezes the rest until it's done with that.
Loading the content of your page first allows it to be displayed, and then JavaScript has all the time it needs to load.
So do like this:
<html>
<head>
</head>
<body>
My great body content!
<script type="text/javascript" src="my/js/files.js">
<script type="text/javascript" src="http://www.googleapi.com/my/external/scripts.js">
</body>
</html>
Instead of this (which is unfortunately still really common):
<html>
<head>
<script type="text/javascript" src="my/js/files.js">
<script type="text/javascript" src="http://www.googleapi.com/my/external/scripts.js">
</head>
<body>
My great body content!
</body>
</html>
Alternately, just add the async at the end of your script tag.
<script src='' async></script>