$(".icon-bg").click(function () {_x000D_
$(".btn").toggleClass("active");_x000D_
$(".icon-bg").toggleClass("active");_x000D_
$(".container").toggleClass("active");_x000D_
$(".box-upload").toggleClass("active");_x000D_
$(".box-caption").toggleClass("active");_x000D_
$(".box-tags").toggleClass("active");_x000D_
$(".private").toggleClass("active");_x000D_
$(".set-time-limit").toggleClass("active");_x000D_
$(".button").toggleClass("active");_x000D_
});_x000D_
_x000D_
$(".button").click(function () {_x000D_
$(".button-overlay").toggleClass("active");_x000D_
});_x000D_
_x000D_
$(".iconmelon").click(function () {_x000D_
$(".box-upload-ing").toggleClass("active");_x000D_
$(".iconmelon-loaded").toggleClass("active");_x000D_
});_x000D_
_x000D_
$(".private").click(function () {_x000D_
$(".private-overlay").addClass("active");_x000D_
$(".private-overlay-wave").addClass("active");_x000D_
});Can anyone help? It's for an upload function I found at http://codepen.io/iremlopsum/pen/YPWPap. Trying to get it into my website
This question is related to
javascript
html
jquery
Make sure that you embedd the jQuery library into your page by adding the below
shown line into your <head> block:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
for latest Jquery. Simply:
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
I would recommend to call the script like this
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/js/my.js"></script>
</body>
The js and css files must be treat differently
Put
jqueryas the first before otherJS scriptsat the bottom of<BODY>tag
HTTP/1.1 specification suggests that browsers download no more than two components in parallel per hostname. <head> tags and let the rest including the jquery to be called on the bottom <body> tag.Put
CSS styleon top of<HEAD>tag after the other more priority tags
HEAD makes pages appear to be loading faster. This is because putting style sheets in the HEAD allows the page to render progressively.css sheets, it is better to put them all on the <head> tag but let the style that shall be immediately rendered to be put in <style> tags inside <HEAD> and the rest in <body>.You may also find other suggestion when you test your page like on Google PageSpeed Insight
Before the closing body tag add this (reference to jQuery library). Other hosted libraries can be found here
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
And this
<script>
//paste your code here
</script>
It should look something like this
<body>
........
........
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script> Your code </script>
</body>
head section of your html page paste: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>and then the reference to your script eg: <script src="uploadfuntion.js"> </script>
4.Lastly you should ensure there are elements that match the selectors in the code.
Source: Stackoverflow.com