I want to link the Social FloatingShare jQuery plugin in HTML document. I have try to link this jQuery plugin, But calling the plugin function floatingShare()
is not working as I excepted.
I have two questions:
My Source Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery Plugin</title>
<style>
body { margin: 0px; padding: 0px; background: #ccc; }
.container { height: 500px; width: 1000px; margin: 0px auto; padding: 0px; }
</style>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css">
</head>
<body>
<div class="container">
<script type="text/javascript">
$(function(){
$("body").floatingShare();
});
</script>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/jquery.floating-share.js" type="text/javascript"></script>
</body>
</html>
By downloading the jQuery library locally 0. min. js file in a directory of your website, e.g. /jquery. We can link jQuery in an HTML page by using a script tag and providing the downloaded jQuery library file address as the src attribute.
Plug-ins can be added to web pages with the <object> tag or the <embed> tag. Plug-ins can be used for many purposes: display maps, scan for viruses, verify your bank id, etc. To display video and audio: Use the <video> and <audio> tags.
At its core, jQuery is used to connect with HTML elements in the browser via the DOM. The Document Object Model (DOM) is the method by which JavaScript (and jQuery) interact with the HTML in a browser. To view exactly what the DOM is, in your web browser, right click on the current web page select “Inspect”.
How to use Plugins. To make a plug-in's methods available to us, we include plug-in file very similar to jQuery library file in the <head> of the document. We must ensure that it appears after the main jQuery source file, and before our custom JavaScript code.
You need to include jquery plugins before its use because all the jQuery or jQuery functions should be available before using, so change the jquery library and script sequence as show below -
NOTE - It is good practice to keep script tag directly into <body>
or <head>
tag instead of any other html element.
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/jquery.floating-share.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("body").floatingShare();
});
</script>
<div class="container">
</div>
</body>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With