All Tutorials - Page 10 of 19

In this post, we’ll show you how to hide a scrollbar while still enable scrolling on any element with CSS. First, If you want to hide a scrollbar and show it when user scroll, just….

Others

Write a Batch Script to Open Chrome

December 28, 2020 Red Stapler 1

Whether you want to automate your routine tasks, doing some experiment or just setting up some pranks, Google Chrome supports command line and let you create a batch script file to control it. In this….

CSS Web Development

How to Center Div Vertically with CSS

December 28, 2020 Red Stapler 0

Vertically centering div can be accomplished by many approaches but the most practical and efficient is using Flex/Grid layout or 2D Transform. Additional consideration is needed if there are more than one div under the….

Javascript

Find Diff between 2 Strings with JavaScript

December 28, 2020 Red Stapler 0

Levenshtein Algorithm is a well-known method to find differences between 2 arbitrary strings. However, if the given strings have equal length, the process is very much simpler by comparing characters on the same position and….

CSS

Creating 3D Cube with Pure CSS

December 28, 2020 Red Stapler 0

3D cube effect can be achieved easily with CSS 3D Transform by creating div for each side of the cube. Then use rotateX, rotateY and rotateZ to put them into their places. Transform-origin is also….

CSS

How to Create Glass Blur Effect with CSS

December 28, 2020 Red Stapler 1

CSS Glass blur effect is very popular on web page that want the div to be transparent and see through background or create a glass cover on another element. The snippet below uses masking trick,….

CSS Javascript

How to Add CSS Animation with JavaScript

December 28, 2020 Red Stapler 0

A JavaScript snippet to dynamically add shorthand CSS animation property to any element. Useful method to insert an animation on a certain scenario. The syntax used in JavaScript code is similar with one in CSS…..

CSS

Toggle Active Button State with JavaScript

December 28, 2020 Red Stapler 0

JavaScript code snippet to add “active” class to any button or div to toggle an active state. Useful for changing styles and appearance of clicked button. The snippet below will add click event listener to….

Javascript

Perform Weighted Random with JavaScript

December 28, 2020 Red Stapler 0

Weighted random is a non-uniform random method that each values has specific probability to be picked. The values with higher weight are more likely to be the random result while lower weighted one are less….

Javascript

How to Deep Clone JavaScript Object

December 28, 2020 Red Stapler 0

Deep Cloning JavaScript object can be very simple or difficult depend on how complicate your object structure is. For an object with basic data types, a one liner code is all you need. But if….

Javascript

Random Number between Range in JavaScript

December 28, 2020 Red Stapler 0

Math.random() is a function that returns a pseudo-random floating numbers between 0 and 1 (0 is inclusive, 1 is exclusive) We usually multiply the result with other numbers to scale the randomized value. However, there….

CSS Javascript Web Development

Recreate Chernobyl AZ-5 Button with CSS/HTML

December 28, 2020 Red Stapler 1

In this tutorial, we’re going to recreate the famous Chernobyl AZ-5 button with CSS and a little bit of JavaScript. Let’s check it out! The AZ-5 Button Here is the button in the movie. I….