I have a question to You.
On my local server my circle charts in JS working normally but when i want to see them through www protocol i don't see them :/. I copied my files many times to server - I don't see charts.
Here is code:
<link rel="stylesheet" type="text/css" media="all" href="css/jquery.circliful.css">
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://www.e-plus.com.pl/mateusz/THEMEFOREST/js/jquery.circliful.min.js"></script>
I tried to do this with my domain adress but result is the same... Webbrowser don't see my charts :(
Did you use any
<base href="http://...">?
Try using:
<link rel="stylesheet" type="text/css" media="all" href="./css/jquery.circliful.css">
<script type="text/javascript" src="./js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://www.e-plus.com.pl/mateusz/THEMEFOREST/js/jquery.circliful.min.js"></script>
Related
Hi everyone I am currently facing a performance issue with an angularJS 1.5.5 app. The homepage takes FOREVER to load, even using the minified libraries it is taking up to 25s to load (just with one user accesing the app).
I first thought that it could be the server where is allocated, but no, if I run my app locally, takes about the same time. This is the waterfall diagram:
Waterfall Diagram
I am not sure why does it takes too long to serve the minified libraries along with the rest of the resources. Even in most of the posts that I have seen related to performance issues, I notice that these libraries are provided in less than a second, maybe 250-500 ms for each of them (maximum).
This is the way I am importing my libraries to my index:
<!--Minified Libraries-->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/min/angular_block_ui.min.css">
<link rel="stylesheet" href="css/min/font-awesome.min.css">
<link rel="stylesheet" href="js/lib/angular-ui-grid/ui-grid.min.css">
<link href="css/style.css" rel="stylesheet">
<link rel="stylesheet" href="css/min/massautocomplete.min.css">
<script src="js/resources/min/q.min.js"></script>``
<script src="js/resources/min/fastclick.min.js"></script>
<script src="js/lib/angular/angular.min.js"></script>
<script src="js/resources/min/angular-animate.min.js"></script>
<script src="js/resources/min/angular-sanitize.min.js"></script>
<script src="js/resources/min/angular-route.min.js"></script>
<script src="js/resources/min/angular-ui-router.min.js"></script>
<script src="js/lib/angular-ui-grid/ui-grid.min.js"></script>
<script src="js/lib/jquery/jquery.min.js"></script>
<script src="js/lib/bootstrap/bootstrap.min.js"></script>
<script src="js/lib/angular-autocomplete/massautocomplete.min.js"></script>
<script src="js/resources/min/ui-bootstrap-tpls.min.js"></script>
<script src="js/resources/min/angular-file-upload.min.js"></script>
<script src="js/resources/min/roundProgress.min.js"></script>
<script src="js/resources/min/angular-charts.min.js"></script>
<script src="js/resources/min/circular1.min.js"></script>
<script src="js/resources/min/circular2.min.js"></script>
<script src="js/resources/min/angular_block_ui.min.js"></script>
<script src="js/lib/pdfmake/build/pdfmake.min.js"></script>
<script src="js/resources/min/vfs_fonts.min.js"></script>
<script src="js/lib/angular/angular-idle.min.js"></script>
<script src="app/app.js"></script>
<script src="app/service/CompensationSrvc.js"></script>
<script src="app/service/security.js"></script>
<script src="app/modules/common/controller/common.js"></script>
<script src="app/modules/home/controller/home.js"></script>
<script src="app/modules/import/controller/import.js"></script>
Thank you in advance!
Any help will be totally appreciated! I have been searching for an answer for the last days and nothing I have seen is as slow as this app.
UPDATE: I am almost sure that the problem is in the backend since the files are being served slowly.
The statement
app.use(express.static(__dirname + "/public")) is at the top of the code, so I am not sure what should I improve to make it faster...
New to jQuery. I cannot get the datepicker to work. Can anyone tell my what I am doing wrong? Thank you, any help is appreciated. Here is the skeleton code:
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function() {
$("#quoteDate").datepicker();
});
</script>
</head>
<body>
<input type="text" id="quoteDate">
</body>
</html>
I have looked at many posts almost identical to this one, but none of the answers worked. I have also downloaded the jQuery UI files to reference them locally, but that wouldn't work either.
They aren't working for you locally because you are running them from a file with a url like file:///Macintosh HD/whatever....
You need to change the lines:
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
to:
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
When you use a // prefix for an asset, it matches whatever protocol you are using. So when you load up something locally (without using a local web server), it looks for file:///code.jquery.com/jquery-1.10.2.js which doesn't exist. Changes the assets to start with http:// or https:// instead of //.
After reading the above answers and your comments, it seems that you are unable to run it locally on your browser.
Referencing Files Locally
Easiest way is to download and keep all the files in same directory.
Let's say the files are
index.htm, jquery-ui.css, jquery-1.10.2.js, jquery-ui.js
File : index.htm
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="jquery-ui.css">
<script src="jquery-1.10.2.js"></script>
<script src="jquery-ui.js"></script>
<script>
$(function() {
$("#quoteDate").datepicker();
});
</script>
</head>
<body>
<input type="text" id="quoteDate">
</body>
</html>
Relative Path
You can give relative path such as
src="js/jquery-1.10.2.js"
src="js/jquery-ui.js"
href="css/jquery-ui.css"
if the directory structure is :
Present Working Directory
index.htm
js (directory)
jquery-1.10.2.js
jquery-ui.js
css (directory)
jquery-ui.css
This question is already asked many times but none of them worked for me. I am trying to use this date picker in a JSP file. This is my script
<head>
<title>My Home</title>
<link rel="stylesheet" type="text/css"
href="../resource/css/page-style.css" />
<link rel="stylesheet" type="text/css"
href="../resource/css/jQuery-ui.css" />
<script src="../resource/js/jquery-1.9.1.js"></script>
<script src="../resource/js/jquery-ui.js"></script>
<script type="text/javascript" src="../resource/js/form-elements.js"></script>
<script type="text/javascript">
$("document").ready(function() {
$("#shortcuts").load("shortcut.html");
$("#datepicker").datepicker();
alert('jQuery is working');
});
</script>
</head>
The shortcut file is loading perfectly, alert is also showing. I get error message as TypeError: $(...).datepicker is not a function. I am not facing this problem if I run this script in a html file placed in my desktop, when I copy the come code to my IDE and run it I get this error in my console. Please suggest me what can I do? I know this question is asked several times I have checked every answer this is the only link having close match to my prob but didn't work for me.
The problem is with your imported files.I think you have not placed them properly.
Try to import these files
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
It is working for me.
see here for more information
Double check that there are no JQuery references after your JQuery-ui reference.
I had an extra JQuery reference that came after my JQuery-ui reference and lost an hour chasing the problem. That will cause the datepicker not found error.
This is something to do with the import files. I also faced the same scenario and following imports helped me to overcome the following issue "datepicker is not a function".
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
Could anyone tell me how to get this code working on a web server. It works fine locally but the calculations don't work online. What has gone wrong? The html file is in the same folder as the jquery.js file.
http://jsfiddle.net/nyree/3CgcH/
thanks in advance for any help
<script type="text/javascript" src="/spreadsheets/jquery.js"></script>
<script type="text/javascript" src="YUI/yahoo-min.js"></script>
<script type="text/javascript" src="YUI/yahoo-dom-event.js"></script>
<link rel="stylesheet" type="text/css" href="YUI/fonts-min.css" />
<script type="text/javascript" src="YUI/cookie-beta-min.js"></script>
<script type="text/javascript" src="YUI/cookie-min.js"></script>
<link rel="stylesheet" type="text/css" href="YUI/tabview.css" />
<script type="text/javascript" src="YUI/element-beta-min.js"></script>
<script type="text/javascript" src="YUI/tabview-min.js"></script>
<link rel="stylesheet" type="text/css" href="YUI/container.css" />
<script type="text/javascript" src="YUI/container-min.js"></script>
None of these files exist on jsFiddle's server. You need to change your reference URLs.
What exists on your server has nothing to do with what exists on jsFiddle's server.
jsFiddle only knows a part of the path, /spreadsheets/jquery.js. That is a relative URL to their server. If you want your code to work on someone elses server, you either need to be able to put the files on their server to maintain the path structure, or change the URLs to be absolute.
<script type="text/javascript" src="http://YOURWEBSITE.com/spreadsheets/jquery.js"></script>
How can I replace following lines with links to the Google jQuery API?
1st line is already done.
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/tab.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/fancybox/jquery.fancybox-1.3.1.pack.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/fancybox/jquery.easing-1.3.pack.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery.cookie.js"></script>
and maybe even this line:
<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/fancybox/jquery.fancybox-1.3.1.css" media="screen" />
You can't...google doesn't host these plugins like they do jQuery Core and jQuery UI.
You can see what they host here: http://code.google.com/apis/libraries/devguide.html
The plugins are not a part of the CDN as of yet. Plugins are mostly user built, so I doubt if there will be a CDN for that.