Menu
How do I make the jquery show up in an existing html document? mainly the jquery lightbox plugin.
236
You can write it directly to the HTML doc inside <script> tags or link with <script src="javascript.
We can include the jQuery CDN URL in the script tag and use jQuery in HTML. We can either write the jQuery in a separate . js file and include it in the HTML file or write the jQuery inside the script tag. First, go to the JQuery CDN website and choose the latest stable version of the jQuery.
reference the jQuery script followed by the lightbox script in your html document.Like so,
<!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" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="source-of-jquery.js"></script>
<script type="text/javascript" src="source-of-lightbox-plugin.js"></script>
<script type="text/javascript" src="source-of-script-with-your-jquery-code-in.js"></script>
</head>
<body>
....
then you will need to use the lightbox accordingly. For example, in source-of-script-with-your-jquery-code-in.js
$(function() {
$('#gallery a').lightBox({fixedNavigation:true});
});
binds the lightbox plugin to each <a> element that is a child of the element with the id gallery
EDIT:
jQuery is nothing but a JavaScript framework (albeit a great framework). If you're starting out on your front-end web development journey, I would suggest looking at JavaScript in conjunction with jQuery as it is the building block of the framework and will help you to understand how it works better. Here are some resources to get you started
good resources for learning javascript
best resources to learn javascript
190
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
