How to query z-index with jquery
Dec 29, 2021 pm 01:57 PMJquery method to query the element "z-index": 1. Use the "$(element)" statement to obtain the specified element object; 2. Use the css() method to return the "z-index" attribute of the specified element Value, the syntax is "element object.css("z-index")".
The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.
How jquery queries z-index
css() method sets or returns one or more style attributes of the selected element.
Return the value of the specified CSS property, the syntax is as follows:
css("propertyname");The example is as follows:
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("z-index = " + $("img").css("z-index"));
});
});
</script>
<style type="text/css">
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
</style>
</head>
<body>
<h1 id="This-nbsp-is-nbsp-a-nbsp-heading">This is a heading</h1>
<img src="/static/imghw/default1.png" data-src="/i/eg_smile.gif" class="lazy" / alt="How to query z-index with jquery" >
<p>由于图像的 z-index 是 -1，因此它在文本的后面出现。</p>
<button>返回img元素的z-index</button>
</body>
</html>Output result:
After clicking the button:
Recommended related video tutorials: jQuery video tutorial
The above is the detailed content of How to query z-index with jquery. For more information, please follow other related articles on the PHP Chinese website!
Hot Article
Hot tools Tags
Hot Article
Hot Article Tags
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
Detailed explanation of jQuery reference methods: Quick start guide
Feb 27, 2024 pm 06:45 PM
Detailed explanation of jQuery reference methods: Quick start guide
How to use PUT request method in jQuery?
Feb 28, 2024 pm 03:12 PM
How to use PUT request method in jQuery?
How to remove the height attribute of an element with jQuery?
Feb 28, 2024 am 08:39 AM
How to remove the height attribute of an element with jQuery?
jQuery Tips: Quickly modify the text of all a tags on the page
Feb 28, 2024 pm 09:06 PM
jQuery Tips: Quickly modify the text of all a tags on the page
In-depth analysis: jQuery's advantages and disadvantages
Feb 27, 2024 pm 05:18 PM
In-depth analysis: jQuery's advantages and disadvantages
Use jQuery to modify the text content of all a tags
Feb 28, 2024 pm 05:42 PM
Use jQuery to modify the text content of all a tags
Understand the role and application scenarios of eq in jQuery
Feb 28, 2024 pm 01:15 PM
Understand the role and application scenarios of eq in jQuery
Summary of commonly used file operation functions in PHP
Apr 03, 2024 pm 02:52 PM
Summary of commonly used file operation functions in PHP
