I’ve made flip card with mouse hover by HTML & CSS. I want to do that after clicking on the “back” the card does not return to the front (on one page will be few these flip card, so when clicked 1st will be the on “back”, then clicking another one and this two cards will be o…
Tag: css
How do you read the rotation of a div using javascript?
I have a spinning wheel that I need to read the rotation for. It spins and stops, then I need to read the rotation to know how many points to assign to it. (the wheel with point values on it). How would I do this? I would think that it would be document.querySelector(“.container”).style.transform.…
Divs not stacking, instead is overlapping
I am trying to stack a div containing buttons under another div that contains a flipbook created using turnjs. This is how the webpage looks like: https://imgur.com/a/Nwp3Mgi . I want to position the buttons under the flipbook, but it will overlap instead. This is the html: This is the css: How do I ensure th…
Div will always shift up after refreshing the page
I have 2 divs on the webpage, the flipbook that is created using turnjs and another div containing the buttons. When I load the page, the divs are in the center of the page: https://imgur.com/a/lLb2g2l . After I refresh the page, the divs will shift up and stay there even after refreshing the page. This is ho…
CSS Image overflow hidden without stretch
I am trying to reduce the thumbnail’s height without stretching the image. Despite I wrote my code in React I know is pure CSS. For example, I used a sample screenshot from Wikipedia, its height is too large to fit “in a thumbnail” so I need to reduce it so a JavaScript library can autoscrol…
Ion RangeSlider without jQuery
Is it possible to get a ion rangeslider without jQuery ? The script below cause problems on my website with a part of the menu dedicated to users. I tried to remove the jQuery by following the reference below, but failed. https://www.npmjs.com/package/vanilla-rangeslider Anyone kind enough to help me? Is ther…
Vue update data prop whenever element clientWidth changes
I’m currently setting a data prop called w to whatever the clientWidth is for an element that I have in my HTML. It looks like this within my mounted hook: This works fine for initially setting this.w width that element’s clientWidth but what I’m trying to do now is change the value of w whe…
How can you change a CSS value when a JS value reaches a certain value?
So, I’m making a web game, where the site gets mad at you. I’ve completed the anger level internal coding, and I’m currently working on implementing a color-changing feature when the anger level reaches a certain value. I want it to change a few tints redder when the anger level reaches an i…
css different style to specific div created by map
I am creating a list of divs, which was created with map. this renders a list of divs, and I was able to change each div background, when hover, like this: I wish to be able to click on a div, and change its background color to white. everything I try will change the background of all the 10 divs
Uncaught TypeError: Cannot read property ‘style’ of null in function
I have seen many questions about this error but, I haven’t found the answer on any of them. I’m creating an interactive page to create patterns based on geometric shapes and I’m having problems adding a new element with a function that creates a new element and adds the element to a “base” div. Then, the base…