I am using a simple plugin from http://www.highcharts.com/demo/pie-basic which has a javascript file stored in view options. I am using this file in my index.html code as <script src="js/pie1.js"></script> inside <body> tag where pie1 is a javascript file stored in js folder. When i run my html page nothing happens.
can anyone help me where I am getting wrong? I am new to using plugins so please bear with me and correct me if anything is wrong.
Most likely you have this situation because javascript start running the plugin before your html is ready.
Place <script src="js/pie1.js"></script> just before closing tag </body>
Related
I am given this code which should display an embedded small coupon version of this page https://weedmaps.com/deals#/1118217:
<script type="text/javascript">var coupon_id = 17811;</script>
<script type="text/javascript">var coupon_type = "deliveries";</script>
<script type="text/javascript" src="https://weedmaps.com/embed/coupon.js"></script>
I do not know how to add the JavaScript to the HTML correctly. I have placed the following scripts in the head section. But I don't understand how to have the coupon generate in the div I want it to. I have tried calling the JavaScript function, but I've never worked with JavaScript before. Could someone please help me embed this coupon.
I've taken a look at your script and first of all: it definitely should be placed inside the document and not into the <head> section because coupon.js is writing out html at the placement of the coupon.js script import.
In theory you just need to place the script and it should work but there are some problems:
You need to execute it on a web server - when running as a plain html file the script just tries to find the libraries in your file system which does not work.
It still would not work because it would still try to find some resources at your web-server. In mycase it the script tried to load http://localhost:63342/restpoints/deliveries/17811/deal which will not work
To prove 2. just try https://weedmaps.com/restpoints/deliveries/17811/deal with the correct domain. Then you are receiving correct JSON which is used to fill the coupon pane.
=> Consequently the script you were given has problems if it should be executable from domains different from "weedmaps.com"
Javascript can be between head tag but it advisable to put it below before the body closing tag, to allow your page contents loads first before loading javascript. Just import your javascript. and call out. Hope this was helpful.
<!DOCTYPE html>
<html>
<head>
</head>
var coupon_id = 17811;
The JS indicates it is looking for an element with an id of #weedCouponPane. Do you have this in your html? i.e.
<div id="weedCouponPane"></div>
I'm trying to put a code snippet into an external .js. Works fine as is inside the page file but stops working if I pull out the script to an external file. I'm thinking it's a variable issue but I'm not entirely clear how to fix that. Little help. Thanks.
Here's the current working internal code:
<script src="scripts/jquery-1.12.4.min.js"></script>
<script src="scripts/jquery.flurry.js"></script>
<script>
$(document).ready(function(){
$("body").flurry({height:300,frequency:98,speed:4321,small:11,large:61,wind:40,windVariance:98,rotation:272,rotationVariance:98,
startOpacity:1,endOpacity:0,opacityEasing:"cubic-bezier(1,.3,.6,.74)",blur:true,overflow:"hidden",zIndex:9999});
$(".toggle-snow").on("click",function(event){
event.preventDefault();
try{
$("body").flurry("destroy");}
catch(err){
$("body").flurry();}
});
});
</script>
When I pull that third script into a fall.js file, the code stops working. Is there something that I need to add to the external script or the internal file?
--
Ah! Silly me. Needed to just remove the open / closing tag in the fall.js file.
Why do you have the "?>" and inside the fall.js remove the opening and closing tags.
Keep references to the other external files in the html
Before referring to fall.js
How are you trying to register the script?
<script src="scripts/jquery-1.12.4.min.js"></script>
<script src="scripts/jquery.flurry.js"></script>
<script src="fall.js"></script>
This should be enough to make the script work, as long as the fall.js file is served in the /fall.js route
I'm totally new at coding and i have some trouble using the dragNodes plugin. I can make the plugin work by itself with the generated random graph example, but I am struggling to make it work with my own graph.
I don't understand what to put in the html. I tried to put only that:
`<script src="sigma.js/plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js"></script>sigma.plugins.dragNodes(s, s.renderers[0]);`
and it doesn't make my nodes move. I think I have to change the content of "s" and "s.renderers[0]" but I cannot find where., and I don't know how to do it...
Basically, I would love if anyone could give me some explanations about how to plug a plugin in my page?
If you could help me, I'm lost and that would be awesome! Thank you a lot!
I think you are mixing up two things:
How to use script into html
How to include external js files in a web page.
In order to insert javascript directly into an html page you have to use the script tag as follow (called inline js):
<body>
<script>
// some inline js
var a = 1;
</script>
</body>
In order to include js from an external file you have to reference the file with the src attribute just like you did.
<script src="sigma.js/plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js"></script>
The only thing that you missed is that sigma.plugins.dragNodes(s, s.renderers[0]); is also some js code, you thus have to put it into script tags to that it can be interpreted as such by the browser.
Here is what you probably are trying to write:
<script src="sigma.js/plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js">
</script>
<script>
sigma.plugins.dragNodes(s, s.renderers[0]);
</script>
Having all this into <body>tags.
I should also mention that to render your graph using sigma you should have an instance of sigma in your page, and in your case it should be called s.
To learn more about js/web programming I would advise this: http://www.codecademy.com/
As far as documentation for sigma is concerned check out their tutorial: http://sigmajs.org/
In addition to Nicolas Joseph's answer (put javascript in script tag), you should also download the js library that is required and save the html file in the appropriate path.
For example if your file.html is in a directory dir (dir/file/.html)
Then the command:
<script src="sigma.js/plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js">
</script>
will search for a file named sigma.plugins.dragNodes.js in the following path:
dir/sigma.js/plugins/sigma.plugins.dragNodes/sigma.plugins.dragNodes.js
To check out which librarires you are missing you should open debug mode in your browser (right click->inspect element) and check the console tab.
Cheers
I'm following a tutorial for vendoring jQuery in a Sinatra app and I can't seem to get jQuery to function. I usually use Google's CDN to load jQuery and it works every time but I can't seem to load it by vendoring and I don't know why. I'm more than certain this is something very trivial but I don't see it. Here are the directions I've followed as suggested by my tutorial.
Create a public/vendor/jquery.js file
Copy and paste the the UNCOMPRESSED jquery 1.11 into jquery.js
Create a javascripts/rating.js file and include this code to verify if jquery loaded.
$(function(){
console.log("loaded...");
});
When I use the inspect element tool and click on the Network tab, it says that jquery can't be found. What's going on? Oh and this is my index.html.erb file:
<body>
<h1>Rate It</h1>
<div id="rating-container"></div>
<script src="public/vendor/jquery.js" type="text/javascript"></script>
<script src="javascripts/rating.js" type="text/javascript"></script>
</body>
Help would be greatly appreciated. Thanks guys.
I finally got it. The tutorial has a typo in it! Referencing vendor/jquery.js instead of public/vendor/jquery.js worked. Geez.
I am teaching myself how to program usign JS, jQuery, HTML and CSS. I downloaded the jquery-master from github and use it in my project, however I still cannot get it to import into my HTML files so that I can utilize it. Does anybody know how? Any help would be appreciated!
you can use this js file you donot need to download js files you just need to place this script tag to each html page where you are trying to play with jquery code.
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
use this script and include your jquery code inside this script block
<script type="text/javascript"> alert('hi friend') </script>
hope this will works Thanks.