z-index

Why does z-index not work?

社会主义新天地 提交于 2019-12-25 01:17:29
问题 So if I understand z-index correctly, it would be perfect in this situation: I want to place the bottom image (the tag/card) below the div above it. So you can't see the sharp edges. How do I do this? z-index:-1 // on the image tag/card or z-index:100 // on the div above doesn't work either. Neither does a combination of anything like this. How come? 回答1: The z-index property only works on elements with a position value other than static (e.g. position: absolute; , position: relative; , or

Display Dojo Dialog over Google Earth plugin

南楼画角 提交于 2019-12-24 18:42:57
问题 Common problem: I'm writing a web app with Dojo that has Google Earth front and centre (via the plugin), and I want to display Dojo dialog boxes (such as confirmations and forms) over the Google Earth display. The dijit.Dialog widget is inevitably rendered underneath the Earth display, even when the dialog has a very large z-index, and the Earth container (and internal elements) have negative z-indexes. This question is relevant - it seems due to the IFramey nature of the plugin that a shim

cytoscape.js pan and z-index/ foregrounding Elements on Click

点点圈 提交于 2019-12-24 16:29:54
问题 I've been using cytoscape.js, and I've run into a few issues while trying to use the graphs. 1) Is there a way to pan by clicking and dragging the background? It seems like it should work, but I've been totally unable to get it to. At some point I'll probably add panzoom, but if it's possible to do it without as well that would be helpful. Here's a jsfiddle, which contains a simplified version of my code. The zoomEnabled: false is working properly, but the panningEnabled: true does not seem

Make parallaxed element completely opaque

霸气de小男生 提交于 2019-12-24 11:49:07
问题 I have the following HTML structure: <section class="mysection"> <div class="parallax"> <div> <svg></svg> </div> </div> </section> <section class="back"> <div class="triangle"> <img src="img/red-triangle-bkgrd.png"> </div> </section> This is the CSS in LESS: .parallax{ width: 90%; margin-left: auto; margin-right: auto; } section.back { .triangle { position: relative; img { position: absolute; right:0; top: 0; } } } Before using parallax on the parallax , back just sits immediately below the

Issues with negative z-index in IE8

假装没事ソ 提交于 2019-12-24 11:19:03
问题 I am using two pseudo elements to create a banner effect on a div, like so: div { position: relative; width: 200px; background-color: #999; } div:before, div:after { content: ""; width: 10px; height: 0; display: block; position: absolute; z-index: -1; top: 10px; border-top: 10px solid #666; border-bottom: 10px solid #666; } div:before { right: -20px; border-right: 10px solid transparent; border-left: 10px solid #333; } div:after { left: -20px; border-left: 10px solid transparent; border-right

Change z-index with counter-increment

社会主义新天地 提交于 2019-12-24 10:36:28
问题 I try to make an image slider which will show a picture when a mouse hovers over a dot. I tried too switch between images by using z-index but nothing moved. .slider { counter-reset: index 1000; } .slider input[name='slide_switch']:hover+label+img { counter-increment: index; z-index: counter(index); } 回答1: The way you were trying to use counter wasn't going to work even if you used JavaScript/jQuery. The counter properties are used to number elements like an ordered list it has nothing to do

How to display one DIV over another DIV in IE6?

微笑、不失礼 提交于 2019-12-24 09:58:14
问题 I am writting some html code which have following structure <div style="position:relative"> <form> <table> <tr> <td> <div id="Upper_Element" style="position:absolute;z-index:10"></div> </td> </tr> <tr> <td> <div id="Lower_Element" style="position:absolute;z-index:-1"></div> </td> </tr> </table> </form> </div> here Upper_Element is a YUI autocomplete text box (where suggestion are displayed when user enters anything like google) and Lower_Element is normal drop down box( <select> ). In IE6 ,

z-Index Issue with jqGrid and Wijmo WijMenu

我只是一个虾纸丫 提交于 2019-12-24 09:49:38
问题 I am trying to use the jQuery-based Wijmo WijMenu control with jqGrid in order to create a dynamic grid toolbar. Getting the menu to appear works fine. However, my menuitem1 has a submenu, and this submenu falls behind the jqGrid when I hover over 'menuitem1'. I've tried setting the z-Index on the menu and the individual menu items, but with no luck. This behavior happens on IE9, Chrome, FF and Safari. It does work when I turn compatibility mode on with IE9, which makes me think it may have

WebKit: Is there any css trick to bring elements to front without scaling it?

╄→尐↘猪︶ㄣ 提交于 2019-12-24 09:13:13
问题 From the picture, I use rotate3d() to the red rectangle so half of it is in front of black rectangle and the other is behind. I want black rectangle to be front of red rectangle so I have to use translateZ() so it become The problem is that I want black rectangle to be front without scaling it. I want black rectangle to still be the same size. Is there any trick? I tried z-index but it didn't work. I guess it because I use rotate3d(). Thanks in advance. 回答1: I do not have access to Safari at

jQuery Plugin does not work in a Modal

旧巷老猫 提交于 2019-12-24 07:27:44
问题 I am using this in a modal: http://www.web2media.net/laktek/2008/10/27/really-simple-color-picker-in-jquery/ but it does not work. The same code: //Start of document Ready which contains event handlers $(document).ready(function() { $('#ForeColor').colorPicker(); }); <input type="text" value="#333399" id="ForeColor" class="colourPicker" /> works fine in a normal page but as soon as I load it in a jQuery UI Modal (the contents of which come from an ASP.Net MVC partial view) it breaks! It does