hover

问题 Chris Coyier once posted an article on CSS-Tricks website on how to achieve this effect: ul:hover li:not(:hover) { opacity: .5; } But what I'm also trying to achieve is smooth and easy hover transitions. I'm just not sure how or where to insert the "smooth hover transition" part of the code. a { color: #cccccc; -webkit-transition: color .5s linear; -moz-transition: color .5s linear; -ms-transition: color .5s linear; -o-transition: color .5s linear; transition: color .5s linear; } a:hover {

问题 I want to hover on some element, let say document.getElementById("abc") and find its hover computed style. How should I do it in Node.js using Puppeteer? 回答1: You can use the following solution to iterate and hover over certain elements to obtain the computed style: const elements = await page.$$('.abc'); const data = []; for (let i = 0; i < elements.length; i++) { await elements[i].hover(); data.push(await page.evaluate(element => window.getComputedStyle(element), elements[i])); } console

问题 I want to hover on some element, let say document.getElementById("abc") and find its hover computed style. How should I do it in Node.js using Puppeteer? 回答1: You can use the following solution to iterate and hover over certain elements to obtain the computed style: const elements = await page.$$('.abc'); const data = []; for (let i = 0; i < elements.length; i++) { await elements[i].hover(); data.push(await page.evaluate(element => window.getComputedStyle(element), elements[i])); } console

问题 this question might be obvious but i'm new in css. I'm animating a shape so when you hover it, it stretches. I've completed the hover on with a nice ease transition but when you move off the mouse the transition doesn't work. Is there a way to make it happen also in the hover off moment? .shape1{ position: absolute; background:red top:512px; width:180px; height:140px; } .shape1:hover { height: 160px; top:492px; transition: 0.2s ease; } 回答1: Your answer You have added the transition property

问题 I'm trying to make the hover on an element, making it bigger by few percent, but I'd like to have the title and the contents inside stay where they are. If I just add scale(1.05) to the element, the contents will scale as well. If I try to counter scale the inner element with scale(0.95) the size will be like the original, but the placement won't be the same: .container { display: block; width: 100%; padding: 50px; } .element { height: 562px; width: 590px; display: inline-block; position:

问题 I'm working on my website and was originally using two separate images at the size of 210 by 210px for an image link (which changes into another image when hovered over.) However I found that there was always a little flicker when first hovering over the image which obviously bothered me so I decided to switch to a CSS sprite with two the images on it instead. That way I wouldn't get the flicker. Unfortunately, I can't seem to get the CSS sprite to work successfully. I'm creating my website

问题 I'm working on my website and was originally using two separate images at the size of 210 by 210px for an image link (which changes into another image when hovered over.) However I found that there was always a little flicker when first hovering over the image which obviously bothered me so I decided to switch to a CSS sprite with two the images on it instead. That way I wouldn't get the flicker. Unfortunately, I can't seem to get the CSS sprite to work successfully. I'm creating my website

问题 I've made a responsive image grid and am trying to add a hover effect to it so that the image gets a dark overlay and some text fades in on it. However, I've been having a tough time implementing it. Here's my HTML structure. <div class="tile"> <img src="some_image" class="animate"> <div class="overlay"> <p>Mahatma Gandhi</p> </div> And here's my CSS .gallery .row .tile:hover ~ .tile img { transform: scale(1.2); } However upon hovering over the image, it does not have the expected behaviour.

问题 This question already has answers here : Is there a “previous sibling” selector? (22 answers) Closed 2 years ago . I'm trying to affect an outside element when a div is hovered. Something like this: <div class="affected"> Hi </div> <div> <div class="hover-me"></div> </div> CSS: .hover-me:hover ~ .affected { color: } I've tried with other sibling selectors but it doesn't work. 回答1: With pure CSS that's gonna be as tricky as it gets. An approach, IF you don't need pointer-events (hover, clicks,

问题 This question already has answers here : Possible to make labels appear when hovering over a point in matplotlib? (10 answers) Closed 1 year ago . I want to annotate different lines on a plot when hovering with the mouse, the same way is done here with points Possible to make labels appear when hovering over a point in matplotlib? I tried to adapt this code as the following : import matplotlib.pyplot as plt import numpy as np; np.random.seed(1) y = np.random.rand(4,15) x = [np.arange(15) for