I have this script installed on my website:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js' type='text/javascript'/>
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'>
{lang: 'en-US'}
</script>
When I try to add another element with following script, it refuses to show up any responce -
<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.js"></script>
<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.flexslider-min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(window).load(function() {
$('.flexslider').flexslider({
});
});
});
</script>
What could be the issue and how to resolve that?
You can do without the window.load event.
<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.js"></script>
<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.flexslider-min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.flexslider').flexslider({});
});
</script>
remove the below script
<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.js"></script>
you have already loaded the jquery using below line
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js' type='text/javascript'/>
Please check on browser console, you should see some error or more information on error.
Related
I am using a call to smoothscroll.init() which looks like this:
new WOW().init();
//smoothScroll
smoothScroll.init();
But I am getting the following error:
Uncaught ReferenceError: smoothScroll is not defined
at main.js:136
at main (main.js:140)
at main.js:144
Could anyone help me figure out why?
These are my javascript libraries:
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/SmoothScroll.js"></script>
<script type="text/javascript" src="js/wow.min.js"></script>
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="js/jquery.isotope.js"></script>
<script type="text/javascript" src="js/jqBootstrapValidation.js"></script>
<script type="text/javascript" src="js/contact_me.js"></script>
<script type="text/javascript" src="js/owl.carousel.js"></script>
First add this to your project:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Second: make sure your path to smoothscroll is correct.
Third: identify each of your html you want to use smoothscroll on with the class class="smoothScroll".
Fourth: the smoothscroll you are using now isn't editable in another javascript directory, it's only used for inside your html, as it already uses the smoothscroll.
EDIT:
If you want to use your own smoothscroll, I'd recommend you to look at this.
I include a javascript file that displays a chart and I get this message : TypeError: $(...).visualize is not a function
I tried with jQuery().visualize and this is the same thing.
Here is my code :
<script type="text/javascript">
$(function () {
$('table').visualize({ type: 'line' }).appendTo('body');
});
</script>
Libraries :
<script language="javascript" type="text/javascript" src="Scripts/jquery.visualize.plugin.js"></script>
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
I'm new in javascript, I don't understand.
The problem is you include visualize library before you include jQuery. Swap the includes in places as follows:
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
<script language="javascript" type="text/javascript" src="Scripts/jquery.visualize.plugin.js"></script>
Change the order of your including - JQuery must be added first.
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
<script language="javascript" type="text/javascript" src="Scripts/jquery.visualize.plugin.js"></script>
You need to include the jquery.visualize.plugin.js AFTER jQuery. It's dependent.
You can also remove the language="javascript".
Like this:
<script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.visualize.plugin.js"></script>
I have two jQuery files.
One is for calling datepicker and the other is for calling highchart files.
When I am trying to include both files, my highchart is working and datepicker is not working.
Here is the source code - code for datepicker:
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.datepicker-cc.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/calendar.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.datepicker-cc-ar.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.datepicker-cc-fa.js"></script>
Code for hichchart is:
<script src="<?=base_url()?>js/jquery-1.9.1.js"></script>
<script src="<?=base_url()?>js/highcharts.js"></script>
<script src="<?=base_url()?>js/exporting.js"></script>
I have also tried to put the jQuery noconflict to any where of my code I got no result
<script type="text/javascript">$.noConflict();</script>
Any help will be appreciated.
Try to use only the jquery's and jquery ui's newer version,
<script src="<?=base_url()?>js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.datepicker-cc.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/calendar.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.datepicker-cc-ar.js"></script>
<script type="text/javascript" src="<?=base_url()?>Date_Component/scripts/jquery.ui.datepicker-cc-fa.js"></script>
<script src="<?=base_url()?>js/highcharts.js"></script>
<script src="<?=base_url()?>js/exporting.js"></script>
try something like this
<script src="<?=base_url()?>js/jquery-1.9.1.js"></script>
<script type="text/javascript">
var jq = jQuery.noConflict( true );
//use jq for highchart
</script>
First call jquery
<script src="<?=base_url()?>js/jquery-1.9.1.js"></script>
and Use following code after calling jquery
<script type="text/javascript">
var jqobj = jQuery.noConflict( true );
</script>
MooTools.More={version:"1.2.4.2",build:"bd5a93c0913cce25917c48cbdacde568e15e02ef"};(function(){var a={language:"en-US",languages:{"en-US":{}},cascades:["en-US"]};
-->mootools is not defined in firebug.
I am making a contact Us formchecker.
<script language="javascript" type="text/javascript" src="js/mootools/mootols-1.js"> </script>
<script language="javascript" type="text/javascript" src="js/mootools/mootools-1.2.4-core-yc.js"></script>
<script language="javascript" type="text/javascript" src="js/formcheck/lang/en.js"> </script>
<script language="javascript" type="text/javascript" src="js/formcheck/formcheck.js"> </script>
<link rel="stylesheet" href="js/formcheck/theme/blue/formcheck.css" type="text/css" media="screen" />
<script type="text/javascript">
window.addEvent('domready', function(){
new FormCheck('myform');
});
</head>
Try fixing the spelling of "mootols" in the first line.
If this is your mootools core:
js/mootools/mootools-1.2.4-core-yc.js
Then what is this?
js/mootools/mootools-1.js
Could it be mootools more? You need to load the core first.
MooTools-More code depends on MooTools-Core code to be loaded first.
Make sure that MooTools-Core is loaded before MooTools-More.
I have a jQuery library code in jquery.xyz.js .
I have an html file which uses the function defined in jquery.xyz.js in this manner .
<html>
<body>
<script type="text/javascript">
document.write("This is my first JavaScript!");
$(function(){ $("ul#xy01").xyz(); });
</script>
</body>
</html>
But the jQuery is not running, which I am assuming because I haven't loaded the jQuery properly onto the html page. So how do I do it?
<script type="text/javascript" src="jquery.js"></script>
See how jQuery works in the manual for the basics, and the download page to fetch the library (or to find out addresses for direct linking on a Content Delivery Network).
You just need to include the script files before using functions defined in them ($ is just a function), for example:
<html>
<body>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.xyz.js"></script>
<script type="text/javascript">
$(function(){ $("ul#xy01").xyz(); });
</script>
</body>
</html>
Be sure to include jQuery before plugins that rely on it, or you'll get some errors first thing.
<script>
var script = document.createElement('script');
script.onload = function () {
//do stuff with the script
};
script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/xx.xx/jquery.min.js';
document.head.appendChild(script);
</script>
<script type="text/javascript" src="PATH TO YOUR JS FILE"></script>
Stick this above your jQuery code in the <head></head>
<script src="/js/jquery.js" type="text/javascript"></script>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js">
</script>
</head>
<body>
<script type="text/javascript">
document.write("This is my first JavaScript!");
$(function(){ $("ul#xy01").xyz(); });
</script>
</body>
</html>