[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x

jQuery

17K

Solutions

32

Content

i
The collection of articles, videos, and posts on this topic.

5K

Contributors

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.

Share tech news, updates, or what's on your mind.

Sign up to Post

I am using google API 3. I am removing all controls from Google Maps, but I only want to keep Full screen icon. How can I do it?


Here is my code which hides all controls
function initialize() {
  map = new google.maps.Map(document.getElementById('map_canvas'), {
  center: {lat: 25.263856, lng: 51.497131},
  zoom: 3,
  disableDefaultUI: true
});
}

Open in new window
0
2 Comments
Learn Ruby Fundamentals
LVL 12
Learn Ruby Fundamentals

This course will introduce you to Ruby, as well as teach you about classes, methods, variables, data structures, loops, enumerable methods, and finishing touches.

Learn More!
PHP or jQuery in a form.  I am working on something that was coded a long time ago. There is a registration form that takes your first, last and email.  They want to integrate a mailing list manager and need to pass, first_name, last_name and email in the form.  However, the form has customer_first_name, customer_last_name and customer_email.  I can not change the form names because they are used all over the place in the code.  Is there a way to create a hidden input field that will auto populate with the first name, last etc...  so that the form fields are there for the email mailing list  api?
0
5 Comments
I am using Google Maps APi Version 2. I have following questions:

1) Is it possible to add Custom image markers?
2) Is it possible to hide all controls  on map?
3) Is it possible to change default Goolge Maps theme with custom Image?
0
1 Comment
I am using Google MAPS API Ver 2. In my webpage a world image is shown with default google map theme. I need to replace that theme with my custom image and remove all extra controls from map.

Here is my some sample code using Google Maps API Version 2.

<body onload="initialize()">
<?php

include('db.php');

$sql = "SELECT id, node_id, latitude, longitude,country FROM tbl where country<>'' and nid = $nid order by country ";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // output data of each row
    $city_array=array();
    $country_name_array=array();

    while($row = $result->fetch_assoc()) {        
		$country_id=$row["country"];		
	    $nodeid_val=$row["node_id"];
        $name=$row["country"];
        $status=['code'=>200,'request'=>'geocode'];
        $placemark=[
          'address'=>$row["country"],
          'population'=>'',
          'Point'=>['coordinates'=>[$row["longitude"],$row["latitude"],0]]

        ];

        $city_array[]=[
          'country_id'=>$country_id,	
		  'nodeid_val'=>$nodeid_val,
          'name'=>$name,
          'Status'=>$status,
          'Placemark'=>$placemark,

        ];

        $country_name_array[]=['name'=>$name];
    }
} else {
    //echo "0 results";
}

$city_details=json_encode($city_array,true);
mysqli_close($conn);

?>

<script type="text/javascript">	

		// Builds an array of geocode responses 
		var city = <?php echo $city_details; ?>;

		function initialize() {
			map = new

Open in new window

…
0
2 Comments
Hello
I am working with ASP.NET MVC C# (vs.net 2015), trying to create a date picker in my view. I have got the following error message
"0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'datepicker'"

I made sure to include the proper jquery files in my project main layout page, but did not help.


    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />


    <script src="~/Scripts/jquery-3.3.1.min.js"></script>
    @*<script src="~/Scripts/jquery-3.3.1.js"></script>*@
    <script src="~/Scripts/MicrosoftAjax.js"></script>
    <script src="~/Scripts/MicrosoftMvcAjax.js"></script>
-------------------------------------------------------------------------------------------------------------
and here some of my code from my create.cshtml page

      <script type="text/javascript">

          $(function () {
             
                  $("#inventoryID_date").datepicker();
         
          });

      </script>

    <div class="col-sm-1">
                    Inventory Date
                </div>
                <div class="col-sm-2">

                    @Html.EditorFor(model => model.INVENTORY_DATE, new { @id="inventoryID_date" })
                    @Html.ValidationMessageFor(model => model.INVENTORY_DATE, "", new { @class = "text-danger" })


                </div>

thanks,
Mubarak
0
6 Comments
Hello Experts,

I need help with Bootstrap 4.1.3 and Javascript/Jquery to make it work the way I would like to do it.  
I follow this user's example: https://github.com/bootstrapthemesco/bootstrap-4-multi-dropdown-navbar

What I would like to do:
1. How do I get the "arrow" on the submenu to be right-aligned in the uploaded images?  There is a before and an after image.
2. How can I make it so that when I move/hover away from the dropdown menu item, it will collapse.  For example, if I move away from "About Us", the dropdown menu for it, collapse?
3. Finally, I like that you have to click to get the main menu item (i.e Metrics) to expand the dropdown menu.  However, I want it so that when I hover over Submenu, it will expand auotmatically expand.  No clicking, but hovering.

Please provide any assistance for any or all of my wish list.  Thank you.

Here is my code for my menu:

<nav class="navbar navbar-expand-md navbar-light bg-light">
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  
  <div class="collapse navbar-collapse" id="navbarNavDropdown">
    <ul class="navbar-nav">
      <li class="nav-item active"><a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a></li>
      <li class="nav-item dropdown">
        <a class="nav-link

Open in new window

…
0
3 Comments
I have the sample code here https://drive.google.com/open?id=1JvCZb0fdhgmVcXLSGyhV18S_C3G2-vY1

Not a huge code. Please download and click on page.html.


1. Click on "Add Filter". You see a new row is added
r1.png
2.  If user clicks enter in the third filter, I check for Enter key in the input field and do some stuff.  Because the row is built dynamically, this didn't work. It doesn't get executed
$("#reportBuilder :input[type='text'])

3. I added a class thirdFilter to the div. I had a thread where Julian explained dynamic controls.  but I think I've added this class to the wrong div.

4. $("#reportBuilder .thirdFilter :input[type='text']") --> this isn't correct either

How do I find the input field, using div that has class of thirdFilter, when user has pressed Enter.... when this is being built dynamically?

$("#reportBuilder :input[type='text']").on('keypress', function (e) {
		if (e.which === 13) {

			//do something
		}
	});

Open in new window


Tried this as well

$(".thirdFilter").on("keyup", "#reportBuilder", function (e) {
		if (e.which == 13) {
			alert("Enter");
		}
	});

Open in new window
0
8 Comments
I am using Ajax to request the data. I am making an array and send it with json_encode so that I will receive the data in my Ajax Success function.
Now, here is my code:

$sql = "SELECT * FROM  mydata where id=15";		
			$rst = mysqli_query($conn,$sql) or die(mysqli_error($conn));					
			if (mysqli_num_rows($rst) > 0)
			{				
				while( $proj_gall_img = mysqli_fetch_array($rst) )
				{							
					$project_gallery_images[] = $proj_gall_img['img_name'];
					//$project_gallery_images.= $proj_gall_img['img_name']."|";
				}
				
			}
			
$projects_name[] = '<span data-id="' . $projects_row['id'].'" data-title="' . $projects_row['project_title'].'" data-detail="' . $projects_row['project_detail'].'" data-mimage="' . $projects_row['project_image'].'" data-mgallery="' . @$project_gallery_images.'"  class="li-txt" style="color:#ff0000;"><a id="myAnc" href="#">'.$projects_row['project_title'].'</a></span>';

Open in new window


The Problem:
I am easily fetched the value of following data attributes, data-id, data-title, data-detail, data-mimage but I am unable to get the value of data-mgallery in my ajax success function because this is an array.

In my this function I need to fetch this data:
jQuery('body').on('click', 'span.li-txt, span.li-txt2', function() {

var pid = jQuery(this).data('id');
var title = jQuery(this).data('title');
var detail = jQuery(this).data('detail');
var mimage = jQuery(this).data('mimage');	

var gallery = jQuery(this).data('mgallery');	
alert('length='+gallery.length);

Open in new window

The value of pid, title, detail and mimage retrieve successfully, but the value of gallery is Array. How to retrieve it?

Alternatively, how can I fetch the data in Ajax Success method?

Need help in this regard.

Thanks
0
10 Comments
I am calling a WEB API method with parameters from Jquery.
When i run in debug mode on the WEB API side, the parameter always appears null.

On the client side, when the value in the dropdown changes, i call the WEB API method. I have an alert there and i can see the proper value.

Why is the parameter showing up as null on the WEB API side?

My Web API code:
  [EnableCors(origins: "*", headers: "*", methods: "*", SupportsCredentials = true)]
        [Route("api/Services/GetAllServiceItemsForSelectedProgram")]
        [HttpPost]
        public IEnumerable<ServiceItems> GetAllServiceItemsForSelectedProgram(List<LoginParameters> loginParam)
        {
            
            List<ServiceItems> retSvcItem = new List<ServiceItems>();
            object cidString = null;
            //
         }

Open in new window


Jquery Ajax call:
function GetSvcItemsForSelectedProgram(selectProgID) {
            
            alert(selectProgID.value); // value coming good here
            $.ajax({
                type: 'POST',
                url: '/api/Services/GetAllServiceItemsForSelectedProgram',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({ UserName: 'jeri', CompanyID: 'Shah' , ServiceProgramID : selectProgID.value }),
                success: function (data) {
                    $.each(data, function (i, item) {
                        $('#ddSvcProg').append('<option value="' + item.ServiceProgramID + '">' + item.ServiceProgram + '</option>');
                    });
                },
                failure: function (data) {
                },
                error: function (data) {
                }
            });
        }

Open in new window


Internet explorer - developer tools:
I can see the parameters that i sent and the response is 200.

Thanks in Advance
0
9 Comments
I'm trying call this following function in this ajax call,  var myReturn = processLinkedDocuments(reportId, localInvoiceFormatType); but is skipping it at every single time. Not sure if it's because I have it between some if/Statement but no luck... It never call the processLinkedDocuments function

 $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: '@Url.Action("PrintInvoiceStoreData", "InvoicePrinting")',
                    data: data,
                    success: function (response) {
                        if (response.Success) {
                            reportId = response.Message;

                            var reportCount = 0;
                            if ($('#s3foCallAheadList').prop('checked')) {
                                reportCount++;
                                var url = '@printInvoicesCallAheadReportUrl'.replace("CBNR", reportId);
                                console.log("test1");
                                window.open(url);
                            }

                            if ($('#s3foSchedule').prop('checked')) {
                                reportCount++;
                                var url = '@printInvoicesScheduleUrl'.replace("CBNR", reportId);
                                console.log("test2");
                                window.open(url);
                            }

                            if ($('#s3foWorksheet').prop('checked')) {

Open in new window

…
0
4 Comments
HTML5 and CSS3 Fundamentals
LVL 12
HTML5 and CSS3 Fundamentals

Build a website from the ground up by first learning the fundamentals of HTML5 and CSS3, the two popular programming languages used to present content online. HTML deals with fonts, colors, graphics, and hyperlinks, while CSS describes how HTML elements are to be displayed.

Learn More!
Wordpress plugin javascript function overide. I have a plugin that ads functionality to a woocommerce checkout page. I need to over ride a javascript function in the plugin . How do i properly over ride one specific function?
Thanks in advance.
0
2 Comments
jQuery.  Is there a way to reload an entire page, after a confirmation alert is clicked?
0
2 Comments
I am trying to capture the event of the file downloading such that the spinning loader can be stopped, however, I tried multiple ways, it's still not working yet. please see my code below:

<script type="text/javascript">
$(document).ready(function(){
    $(":submit").click(function() {   	
        $('#loader').show();
    
/*
* above block of code works, below block does not
*    
        var fileDownloadCheckTimer;
        fileDownloadCheckTimer = window.setInterval(function(){
        var cookieValue = getCookie('fileDownloadToken');
        if(cookieValue == "fileIsReady") {
        	$('#loader').hide();
        	finishDownload();}
        },1000);
        
    });
});



/**
 * Get a cookie
 * @param {String} cname, cookie name
 * @return {String} String, cookie value 
 */
function getCookie(cname) {
    var name = cname + "="; //Create the cookie name variable with cookie name concatenate with = sign
    var cArr = window.document.cookie.split(';'); //Create cookie array by split the cookie by ';'
     
    //Loop through the cookies and return the cooki value if it find the cookie name
    for(var i=0; i<cArr.length; i++) {
        var c = cArr[i].trim();
        //If the name is the cookie string at position 0, we found the cookie and return the cookie value
        if (c.indexOf(name) == 0) {
        	document.getElementById("demo").innerHTML = c.substring(name.length, c.length);;
            return c.substring(name.length, c.length);
        }
    }

Open in new window

…
0
14 Comments
I need to change css when my program runs.   would like to change css with jquery on   $(document).ready(function () {}

This is the css.  When the file opens I want to change    top:2500px; to    top:25px;

        .templateViewFrame {
            padding:15px;
            height: 700px;
            width: 800px;
            border: solid 1px black;
            position: absolute;
            left: 50px;
            top:2500px;
            background-color:#ededed;
        }
0
3 Comments
I have an Adobe Animate CC project that I have changed to make it better. It is problematic because Adobe has not done a good job of generating code that can run simultaneously on a page. I manipulated the code to be able to do this. Understanding a good amount of JavaScript but not everything I can get this to work. The Adobe Animate CC program generates code that is native Create JS. The local script connects to Create JS to make things animate. When I run the code without a JavaScript timer I think that both functions try to fire at the same time. At this point only, one animation works and shows up. Throwing them into a set Interval fixes this because they are not starting at the same time. I am using jQuery to load and run them on my page. I have seen some jQuery functions, that can run two functions simultaneously. I can’t remember which one.  Does anybody know of way jQuery can call two functions in a way where they do not collide? I am interested in knowing how can get a function to fire and not collide in theory also. So any help for that is appreciated. But I would like to know how jQuery would handle functions totaling two, three, four etc. Thanks
Doberman-German.zip
0
5 Comments
Hello All,

I have a html document like shown below. I am trying to read the text value "123" using Jquery/css selectors. Please advise how can I read text "123"?

The text displayed will not always be 123, it could be 456 or 789 etc. so the url will also change accordingly. The only thing constant in the below table is the word "Chocolate". Is there a way to read the text value 123 based on the key word "Chocolate"?

I was trying div:contains("Chocolate"). I don't know how to traverse html further. I would appreciate your help. Thank you!

****************************************************************************************

<html>
<body>
<table border="1">

        <tr>
            <td>R1C1</td>
            <td>R1C2</td>

        </tr>

        <tr>
            <td>
                <div>Chocolate</div>    
            </td>
            <td>
                <div>
                    <a href="https://123.com">123</a>
                </div>
            </td>
        </tr>
    </table>

</body>
</html>

Open in new window
0
2 Comments
Hi, I'm using  jquery (3.1.1), in my ASP.NET app,  but it gives me the the following error when I try to execute the function below...

"0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'ajax'"

 <script src="Scripts/jquery-3.1.1.min.js"></script>

 function InsertTest(mark) {
            $.ajax({
                        type: "POST",
                        data: param,
               
                        url: "/default.aspx/TestMe",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        data: JSON.stringify({ 'param': param}),
                
                    });
        };

Open in new window


Any ideas??
Thanks!
0
2 Comments
I have an app written in Keno UI (Telerik).  I'm using build.phonegap.com to build runtime for my app, using cordova and Kendo.  I'm stuck on getting the speechrecognition plugin to initialize.  I'm sure it's something stupid but I'm not sure what it is.
Below is a copy of my config.xml file:

<?xml version='1.0' encoding='utf-8'?>
<widget id="ca.xyz.mmb" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>mmb</name>
    <description>
        Integrated Mobile Billing for XYZ Customers
    </description>
    <author email="support@xyz.ca" href="http://xyz.ca">
        Go Team
    </author>
    <content src="index.html" />
    <plugin name="cordova-plugin-compat" spec="^1.2.0" />
    <plugin name="cordova-plugin-file" spec="^4.3.3" />
    <plugin name="cordova-plugin-speechrecognition" spec="1.2.0" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
    <engine name="ios" spec="^4.3.1" />
</widget>

Open in new window

Below is a snapshot of the relevant part of the build.
Build Date: 2018-10-16 05:38:36 +0000

Open in new window

…
0
2 Comments
I am new to knockoutjs. I am creating a table with racers. I can show racer events, but i want to change the position of the racer in the table manually by click button. They perform swap function, but they do not bind values in the table. Without using click action data bind in table with swapping value.
my sample coding is here,
var PlanetsModel = function() {
    self.Racer = ko.observableArray([
        { id: "Racer-101", rank: "5"},
        { id: "Racer-102", rank: "2"},
        { id: "Racer-103", rank: "1"},
        { id: "Racer-104", rank: "4"},
        { id: "Racer-105", rank: "7"},
        { id: "Racer-106", rank: "8"},
        { id: "Racer-107", rank: "9"},
        { id: "Racer-108", rank: "3"},
        { id: "Racer-109", rank: "6"}
    ]);
 
    this.typeToShow = ko.observable("all");
    this.displayAdvancedOptions = ko.observable(false);
	//console.log(self.Racer()[5].rank);    //find particular racer rank value
    
	//setTimeout(function () {
		this.addPlanet = function(type) {
			self.Racer.push({
				id: "New planet",
				rank: type
			});
		};
		console.log(this.addPlanet);
	//}, 4000);
    this.showRacer = ko.computed(function() {
       return self.Racer();        
	}, this);
	var newData = self.Racer();
	console.log("First array : " + JSON.stringify(newData));
	
	/* swap array values based on temp variable */
	self.moveup = function() {
		function swap(input, index_A, index_B) {
			var temp = input[index_A];
			 
			input[index_A] =

Open in new window

…
0
0 Comments
Starting with Angular 5
LVL 12
Starting with Angular 5

Learn the essential features and functions of the popular JavaScript framework for building mobile, desktop and web applications.

Start Today!
Hi Guys,
I have a web application asp.net mvc.
I would like to know if is it possible to upload files automatically from source path on the hard drive:
Let me give you an example:

Lets say I have this these code:
and I return 3 paths of img source and created them on the dom:
 for (let i = 0; i < files.length; i++) {
            $("#ImagesReturn").append('<img style="display:none" src="' + files[i] + '"/>')
        }

Open in new window


Here I got the html on the dom:
 <img style="display:none" src="D:\FIles_test_for_new_viewer\AddPages\2.PNG">
<img style="display:none" src="D:\FIles_test_for_new_viewer\AddPages\1.PNG">
<img style="display:none" src="D:\FIles_test_for_new_viewer\AddPages\3.PNG"></div>

Open in new window


now what I want to do is to upload these 3 paths to the server automatically:
Like loop:
var listOffiles = $("#ImagesReturn img");
        for (let i = 0; i < listOffiles.length; i++) {
            //here I would like to get the [b]files[0][/b] like I click on <input type="file">
        }

Open in new window


There is a way to do something like that? if not please let me know your ideas.



Thank you.
0
2 Comments
How to write a generic function in jquery or javascript where I can filter the data as below
     JsonFruit_US =  filter the  Json_Data 'Location=US' and RecordType='Fruits'
     JsonGrocery_US_US =  filter the  Json_Data 'Location=US' and RecordType='Grocery'
     JsonUS =  filter the  Json_Data 'Location=US' 

String Json_Data = 
{
  "action": "query",
  "Warehouse": "NJ",
  "records": [
      {
		"Location": "US"'
		"RecordType": "Fruits"'
        "Productid": 123,
        "Qtry": 5,
        "Name": "Apple",
      },
      {
		"Location": "UK"'
		"RecordType": "Fruits"'
        "Productid": 124,
        "Qtry": 11,
        "Name": "Bananna",
      }
      {
		"Location": "US"'
		"RecordType": "Grocery"'
        "Productid": 223,
        "Qtry": 5,
        "Name": "Rice-UK",
      },
      {
		"Location": "UK"'
		"RecordType": "Grocery"'
        "Productid": 224,
        "Qtry": 11,
        "Name": "Beans-US",
      }
    ]
};

Open in new window
0
5 Comments
using jquery how can I dynamically update the data-index value and rearrange the div container.  

<div>
    <div id="divA" data-index="1"></div>
    <div id="divB" data-index="3"></div>
    <div id="divC" data-index="2"></div>
</div>

Open in new window


loking for function as 
function sort(a){
     if a = 'ByProd' {
                divA.data-index=1;
                divB.data-index=3;
                divC.data-index=2;
   }else if a = 'ByProd' {
                divA.data-index=3;
                divB.data-index=1;
                divC.data-index=2;
 }else{
                divA.data-index=1;
                divB.data-index=2;
                divC.data-index=3;
}

}

Open in new window
0
4 Comments
I created a modal dropdown form with four dropdown lists, with the fourth dropdown containing a link to a document to display once user clicks the submit button. All four dropdowns work fine, however when clicking the submit button the document does not display. The form simply continues to display, log indicates 'Cannot read property '0' of undefined'.. Any help is appreciated.

var selectedOptions = {};

        $('#link1').on('change', function () {
            var a = $(this).val();
            selectedOptions['1'] = a;
            selectedOptions['2'] = a;
            selectedOptions['3'] = a;
            if (a !== '') {
                for (var i = 0; i < dataSecondSelect[a].length; i++) {
                    $('#link2').append($("<option></option>")
                            .attr("value", dataSecondSelect[a][i])
                            .text(dataSecondSelect[a][i]));
                }
            }
        });

        $('#link2').on('change', function () {
            var a = $(this).val();
            selectedOptions['1'] = a;
            selectedOptions['2'] = a;
            selectedOptions['3'] = a;
            if (a !== '') {
                for (var i = 0; i < dataThirdSelect[a].length; i++) {
                    $('#link3').append($("<option></option>")
                            .attr("value", dataThirdSelect[a][i])
                            .text(dataThirdSelect[a][i]));
                }
            }
        });

Open in new window

…
0
3 Comments
I've created an accordion with anchor links, my issue is how can I trigger the javascript to open the active accordion panel when the anchor link is selected.

<script>

    $(function() {
    $('a[href*="#"]:not([href="#"])').click(function() {
    if (location.pathname.replace(/^\//,'') == 
    this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) 
    +']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
    });
    });
</script>

Open in new window


    <div class="Test">
        <a href="#Link 1st">A</a>
    </div>

   <button class="accordion"><strong><a id="Link 1st"></a>Link 1st</strong> 
   </button>

   <div class="panel"><br />
     <H4>Link 1</H4>
   </div>

Open in new window
0
2 Comments
I have a page with a number of images on. When these images are clicked this brings up a pop out (using bootstrap modal) that has a form on it. What I would like to happen is that when a certain image is clicked it selects a radio button on the form and also opens the modal box.

The link that selects a certain radio button might be on the page more than once so I cannot use ID.

Here is how I have the html

	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option1"><img src="image1.jpg"> <h5>Name 1</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option2"><img src="image2.jpg"> <h5>Name 2</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option3"><img src="image3.jpg"> <h5>Name 3</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option4"><img src="image4.jpg"> <h5>Name 4</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option5"><img src="image5.jpg"> <h5>Name 5</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option6"><img src="image6.jpg"> <h5>Name 6</h5></a>
		
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option1"><img src="image1.jpg"> <h5>Name 1</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option2"><img src="image2.jpg"> <h5>Name 2</h5></a>
	<a data-toggle="modal" data-target=".bs-example-modal-lg" class="option3"><img src="image3.jpg"> <h5>Name 3</h5></a>
	
	<div

Open in new window

…
0
0 Comments

jQuery

17K

Solutions

32

Content

i
The collection of articles, videos, and posts on this topic.

5K

Contributors

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.

Related Topics