Code Snippets Archive - CodexWorld https://www.codexworld.com/code-snippets/ Web & Mobile App Development Company Sun, 02 Jun 2024 06:56:47 +0000 en-US hourly 1 https://www.codexworld.com/wp-content/uploads/2020/04/favicon.ico Code Snippets Archive - CodexWorld https://www.codexworld.com/code-snippets/ 32 32 91409221 Tooltip on Hover with CSS https://www.codexworld.com/code-snippets/tooltip-on-hover-with-css/ https://www.codexworld.com/code-snippets/tooltip-on-hover-with-css/#respond Sun, 02 Jun 2024 06:56:47 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5629 The tooltip is used to display additional information when the user hovers an element. It is very useful when you want to display some extra content within the same webpage. There are various JavaScript plugins

The post Tooltip on Hover with CSS appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/tooltip-on-hover-with-css/feed/ 0 5629 Drag and Drop Sortable List using HTML, CSS, and JavaScript https://www.codexworld.com/code-snippets/drag-and-drop-sortable-list-using-html-css-javascript/ https://www.codexworld.com/code-snippets/drag-and-drop-sortable-list-using-html-css-javascript/#respond Fri, 17 May 2024 05:16:58 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5617 Drag and drop is an interactive feature for a sortable list where the user is allowed to reorder elements in a list by simply dragging and dropping them. If your web application has reordering functionality,

The post Drag and Drop Sortable List using HTML, CSS, and JavaScript appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/drag-and-drop-sortable-list-using-html-css-javascript/feed/ 0 5617 5 Star Rating with Font Awesome Icons and CSS https://www.codexworld.com/code-snippets/5-star-rating-with-font-awesome-icons-css/ https://www.codexworld.com/code-snippets/5-star-rating-with-font-awesome-icons-css/#respond Sat, 30 Dec 2023 05:46:01 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5544 The 5-star rating is a widely used feature for the rating system on a website. It helps to represent the rating number in a graphical view. You can can create 5 star rating view via

The post 5 Star Rating with Font Awesome Icons and CSS appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/5-star-rating-with-font-awesome-icons-css/feed/ 0 5544 HTML Form Validation with Bootstrap https://www.codexworld.com/code-snippets/html-form-validation-with-bootstrap/ https://www.codexworld.com/code-snippets/html-form-validation-with-bootstrap/#respond Wed, 30 Aug 2023 06:15:23 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5457 HTML Form is an essential element in the website. Most of the websites have at least one form section on the web page. It’s always recommended to validate the user’s input before submitting the form

The post HTML Form Validation with Bootstrap appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/html-form-validation-with-bootstrap/feed/ 0 5457 Page Scroll Progress Bar with CSS and JavaScript https://www.codexworld.com/code-snippets/page-scroll-progress-bar-with-css-javascript/ https://www.codexworld.com/code-snippets/page-scroll-progress-bar-with-css-javascript/#respond Fri, 10 Mar 2023 12:39:50 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5285 Scroll Progress Bar is an indicator to show the position the user is on the page. The scroll indicator at the top of the page shows how far the page is scrolled. In terms of

The post Page Scroll Progress Bar with CSS and JavaScript appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/page-scroll-progress-bar-with-css-javascript/feed/ 0 5285 Slick Carousel with Slick Lightbox https://www.codexworld.com/code-snippets/slick-carousel-with-slick-lightbox/ https://www.codexworld.com/code-snippets/slick-carousel-with-slick-lightbox/#respond Fri, 03 Mar 2023 14:12:04 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5273 Slick is a JavaScript library to create a carousel slider. The slick jQuery plugin helps to build an image carousel slider in HTML. The main advantage of the Slick carousel slider is to display multiple

The post Slick Carousel with Slick Lightbox appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/slick-carousel-with-slick-lightbox/feed/ 0 5273 Custom Scrollbar with CSS https://www.codexworld.com/code-snippets/custom-scrollbar-with-css/ https://www.codexworld.com/code-snippets/custom-scrollbar-with-css/#respond Mon, 23 Jan 2023 13:27:35 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5248 The browsers set a default style for the scrollbars on the web pages. You can customize the scrollbar style and override the scrollbar style using CSS pseudo-element. The ::-webkit-scrollbar pseudo-element helps to customize the scrollbar

The post Custom Scrollbar with CSS appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/custom-scrollbar-with-css/feed/ 0 5248 Loading Spinners with CSS https://www.codexworld.com/code-snippets/loading-spinners-with-css/ https://www.codexworld.com/code-snippets/loading-spinners-with-css/#respond Thu, 19 Jan 2023 11:34:29 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5234 Spinners are the small element that indicates the loading state of web page components. Mostly, the loader GIF icon is used as a spinner in loading animation. If you want a simple solution for the

The post Loading Spinners with CSS appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/loading-spinners-with-css/feed/ 0 5234 Tabbed Content with CSS and JavaScript https://www.codexworld.com/code-snippets/tabbed-content-with-css-javascript/ https://www.codexworld.com/code-snippets/tabbed-content-with-css-javascript/#respond Mon, 09 Jan 2023 06:32:25 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5214 Tabs are typically used to display the content of different subjects in the same section. Mainly two types of tabs are used in the web application, horizontal and vertical tabs. HTML tabs element can be

The post Tabbed Content with CSS and JavaScript appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/tabbed-content-with-css-javascript/feed/ 0 5214 Custom Radio Buttons with CSS https://www.codexworld.com/code-snippets/custom-radio-buttons-with-css/ https://www.codexworld.com/code-snippets/custom-radio-buttons-with-css/#respond Sun, 08 Jan 2023 18:15:43 +0000 https://www.codexworld.com/?post_type=code-snippets&p=5211 Radio buttons are displayed in a group of options and only one radio button can be selected at the same time. By default, the browser defines a basic style for radio buttons. To make the

The post Custom Radio Buttons with CSS appeared first on CodexWorld.

]]> https://www.codexworld.com/code-snippets/custom-radio-buttons-with-css/feed/ 0 5211