Preethi Ranjit

A .NET developer with a JavaScript background, Preethi is expert in front-end coding, JavaScript, HTML, and CSS.

Latest posts

Browser Comparison: Opera vs. Brave vs. Vivaldi

The browser market is bustling with countless desktop and mobile browsers. Opera, Brave, and Vivaldi are not as popular as Firefox or Chrome but they …

Create CSS-Only Image Reveal Effect with Transparent Borders

A CSS-only image reveal effect can be solved in different ways. It’s actually quite easy to code a design in which the image stands out of (is overf…

Introduction to the CSS Grid Layout Module

It was once tables, then margins and floats, then flexbox and now grid: CSS always steered towards new and better ways to ease the age-old job of codi…

How to Add Text-to-Speech Feature on Any Web Page

The text-to-speech feature refers to the spoken narration of a text displayed on a device. At present, devices such as laptops, tablets, and mobile ph…

How to Create a Cut-out Border Design with CSS

With a cut-out border design we can show to users what can be found underneath the border area of an HTML element. This task is typically solved by st…

How to Create a CSS Ribbon

We talk about CSS ribbons in web design when a strip of box (called ribbon) wraps another box. It’s a fairly used design technique to decorate text,…

Mastering Synchronous & Asynchronous in JavaScript

In the first part of this post, we saw how the concepts of synchronous and asynchronous are perceived in JavaScript. In this second part, Mr X appears…

How to Create a Text-Search Bookmarklet with JavaScript

Bookmarklets are JavaScript applications that can be accessed as browser bookmarks. They are used to enable users to perform different actions on web …

How to Create CSS-only Sticky Footer

Normally, we need JavaScript to perform scrolling effects related to different user actions on web pages. The script does the job of tracking how far …

Master DOM Manipulation with 15 Essential JavaScript Methods

As a web developer, you frequently need to manipulate the DOM, the object model that is used by browsers to specify the logical structure of web pages…

How to Create a Datalist That’s Instantly Searchable

Dropdown lists are a neat way for providing options for an input field, particularly when the list of options available are long. A user can choose th…

How to Create a Simple Phone Number Picker

Phone numbers, besides names and emails, are the most frequently used contact information in online forms. Phone number fields are usually designed in…