I tried hours to solve this problem, can anyone tell me how can I get those icons or tell me how to make a custom CSS file
files I linked
dataTables.bootstrap.min.css
and following script files
<script src="js/lib/datatables/datatables.min.js"></script>
<script src="js/lib/datatables/cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js"></script>
<script src="js/lib/datatables/cdn.datatables.net/buttons/1.2.2/js/buttons.flash.min.js"></script>
<script src="js/lib/datatables/cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script src="js/lib/datatables/cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script src="js/lib/datatables/cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script src="js/lib/datatables/cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.print.min.js"></script>
Related
Version that works
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<script src="assets/vendor/purecounter/purecounter.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="https://kit.fontawesome.com/b0ca3cb0f7.js" crossorigin="anonymous"></script>
<script src="assets/js/main.js"></script>
Version that doesn't work
<script src="assets/js/main.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<script src="assets/vendor/purecounter/purecounter.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="https://kit.fontawesome.com/b0ca3cb0f7.js" crossorigin="anonymous"></script>
Does main javascript src needs to be placed at the bottom?
It doesn't work when I put it above all scripts.
It won't work if there are custom functions that you might be calling inside Main.js that are dependent on the other scripts which you are loading.
For eg - There is one script SWIPER JS and you might be calling your custom functions in your main.js i.e. to initialize SWIPER JS SLIDER, so until the dependent script i.e. swiper-bundle.min.js is not loaded the custom function inside main.js won't work.
You can check your console to understand what exact error you get.
Press F12 in your browser.
I am trying to acieve cache busting in index.html. Below is my code
<body>
<app-root></app-root>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="<Value>" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js#1.16.0/dist/umd/popper.min.js" integrity="<Value>" crossorigin="anonymous"></script>
<script src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v="+ (new Date).getTime()"' integrity="<Value>" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/ricmoo/aes-js/e27b99df/index.js"></script>
</body>
I am trying to add date in bootstrap.min.js path but when I check link in Network tab, it shows
https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v=%22+%20(new%20Date).getTime()%22
I want to know what should I put in my index.html file so that I will get correct timestamp value.
The problem is that (new Date).getTime() in the line
<script src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v="+ (new Date).getTime()"' integrity="<Value>" crossorigin="anonymous"></script>
is not executed by Javascript, so you are simply appending it as an hardcoded string, and this is why you see that URL.
The correct way to add a timestamp, if you want to do it through Javascript, is this:
<script>document.write("<script type='text/javascript' src='https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v=" + Date.now() + "' integrity='<Value>' crossorigin='anonymous'><\/script>");</script>
In this way you are including a script which includes bootstrap.min.js and appends a timestamp to its URL.
See here for a similar question.
The timestamp can also be included from server side, if you prefer. Example for Java/JSP:
<script type="text/javascript" src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js?v=<%= new java.util.Date().getTime() %>" integrity="<Value>" crossorigin="anonymous"></script>
Side note: the value <Value> for your <script>'s integrity attribute is not valid. You should use the value provided by the Bootstrap CDN: see here.
My site's table with a nav panel has stopped switching tables with the nav. I haven't done any updates recently but a visitor noticed and reported it. Any idea?
You can find the table at http://fatherandsonlending.com/#terms
That's because you didn't include the bootstrap js file in your page. Put
<script type="text/javascript"src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
After your jquery
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript"src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<head>
<title>Mary</title>
<link href="http://localhost/stylesheet.css" type="text/css" rel="stylesheet">
<link href="http://localhost/mary/jquery-ui-1.10.3.custom.min.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
<script type="text/javascript" src="http://localhost/jscript.js"></script>
<script type="text/javascript" src="http://localhost/jquery-ui-1.10.3.custom.min.js"/>
</head>
I just got done learning about jquery ui and am trying to include it in my very first webpage, but it's not working. I checked all of the links on my server, and they link up to the documentation, but the only way the content shows up when I check the webpage on my server is if I comment out the last script tag. But if I do that, I can't access the jquery ui, right? I'm so confused. I'm so excited to try all of this stuff out, but I can't figure out how to make it work :( Any help is greatly appreciated.
karthikr's answer is most likely the problem, but if that doesn't work try referencing the URL hosted by jquery itself.
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
Assuming all the static files are properly referenced,
<script type="text/javascript" src="http://localhost/jquery-ui-1.10.3.custom.min.js"/>
should be
<script type="text/javascript" src="http://localhost/jquery-ui-1.10.3.custom.min.js"></script>
Note the end of the script tag /> should be ></script>
I recently came across this site. http://beta.rallyinteractive.com/. The site uses some fairly complex/awesome animations. They are using only one script file that is minified. I expanded their script using chrome and tried to figure out how exactly they are achieving their animations. I have three questions:
Are their any resources out their that can point me in the right direction on how to create such cool animations.
Are they just using Html5 canvas element and no scripts like Raphael.js?
Is it worth it to learn the how to create canvas animations or do you think there is going to be some sort of Flash IDE that will take away the complexities of learning the API?
Thank you,
Tyrone
If you look at the page source, they have commented a list of javascript files they use.
<!--
<script src="/static/js/flush/events/Events.js"></script>
<script src="/static/js/flush/events/GlobalEvent.js"></script>
<script src="/static/js/flush/events/GlobalEvents.js"></script>
<script src="/static/js/flush/events/MouseEvent.js"></script>
<script src="/static/js/flush/display/Stage.js"></script>
<script src="/static/js/flush/display/Sprite.js"></script>
<script src="/static/js/flush/display/TraditionalSprite.js"></script>
<script src="/static/js/flush/geom/Point2D.js"></script>
<script src="/static/js/flush/utils/Tween.js"></script>
<script src="/static/js/flush/utils/Ease.js"></script>
<script src="/static/js/flush/utils/Utils.js"></script>
<script src="/static/js/flush/color/HEXColor.js"></script>
<script src="/static/js/flush/color/HSVColor.js"></script>
<script src="/static/js/flush/color/RGBColor.js"></script>
<script src="/static/js/rally/sprites/BioIn.js"></script>
<script src="/static/js/rally/sprites/BioShare.js"></script>
<script src="/static/js/rally/sprites/BioTweet.js"></script>
<script src="/static/js/rally/sprites/BigTweet.js"></script>
<script src="/static/js/rally/sprites/BigShare.js"></script>
<script src="/static/js/rally/sprites/NavArrow.js"></script>
<script src="/static/js/rally/CountText.js"></script>
<script src="/static/js/rally/BottomBar.js"></script>
<script src="/static/js/rally/Refresh.js"></script>
<script src="/static/js/rally/DribbbleLink.js"></script>
<script src="/static/js/rally/Icons.js"></script>
<script src="/static/js/rally/TriangleMask.js"></script>
<script src="/static/js/rally/Triangle.js"></script>
<script src="/static/js/rally/Rally.js"></script>
-->