There is a nice CSS property to change any zoom you want and it is called with the same name (zoom), however it doesn’t work well at the same time with mouse dragging selections because of the references and the different implementations around browsers. What you can used instead is another familiar CSS property together with a reference. We are talking about scaling with the transform property and setting up its origin.
Update: if you want to do it easier and in the same page, check this out: How to print a specific HTML element.
If you want to print a specific HTML content, for example everything inside a div tag or a tag element with a particular identifier, you can use window.print() in a new window with just the content you want to. It’s easy but tricky, we would like an accessible print method for any HTML element but there wasn’t.
Don’t forget to add/link some CSS in your new window otherwise you will get the default style from your browser.
Note that write method is synchronous, however sometimes window tries to print before write has finished, it happens only in some browsers ¬¬, therefore trying to avoid this we have added a setTimeout. Yeah, no quite elegant but among all the different ways, it is the shortest that works across all updated browsers so far.
Love to make things as simple as possible xD A hint just inside the input (where you can type), then a button to show the password if you want to see it and finally a button to generate random passwords.
Select each element in a selection loop. If you go forward as soon as you finish the list of elements you will start selecting from the beginning and the same if you go in opposite direction.
Don’t forget to use nextElementSibling and previousElementSibling (DOM Elements) instead of nextSibling and previousSibling (DOM Objects). A DOM Object can be anything: comments, insolated text, line breaks, etc. In our example nextSibling would have worked if we had set all our HTML Elements together without anything between then:
<ul><li></li><li></li></ul>
Have you ever played to Simon? That game where you have to memorize an incremental sequence of colors. Today I’m bring to you this famous game in ES6 using CSS transformations and animations. Open it in a new browser window or tab and stretch or shrink the area to see how the game is always visible, there are not scroll bar at all, pure responsiveness, enjoy the play 🙂
Code once, run everywhere: Simon Game in Google Play