CodemySite_Web development

  This plugin is based on Javascript, it can be easily manipulated with html5 attributes. Official site Step1: link 4 libraries <link href=” https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css ” rel=”stylesheet”> <link href=” https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-star-rating@4.0.7/css/star-rating.css ” rel=”stylesheet”> <script src=” https://code.jquery.com/jquery-3.5.1.min.js ”></script> <script src=” https://cdn.jsdelivr.net/gh/kartik-v/bootstrap-star-rating@4.0.7/js/star-rating.js ”></script> Step2: HTML rating section is an input tag, the default value is 4.3. rating-loading is a spinner when the starts do not show. Step3: js simply select the input DOM, and fire it up with  .rating() The basic options :(I think useful) min, max : the minimum and maximum of the stars rating number. step : changing step period stars : the star number shows showCaptions : if want to hide the captions, set them to false starCaptio...

  Use this cool animation library for your next JavaScript project. Typed.js is a JavaScript animation library. Any string can type customer animated with content, speed, and so on. The most common use as I notice is for a landing page that looks modern in style. Official site: Typed.js Another demo made with love by Matt Boldt. # With NPM npm install typed.js # With Yarn yarn add typed.js # With Bower… mattboldt.com Step1: import js library with npm, yarn, bower, or CDN npm install typed.js yarn add typed.js bower install typed.js or <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script> Step2: HTML The content is included in the <div> The place content actually is typing is the <span> Step3: JS fire up the library with  new Typed('id',options) Customization: stringsElement: the content want to show typeSpeed: the speed of typing backDelay:backDelay time before backspacing in milliseconds fadeOut: fade out animation instead of ba...

  Use this JavaScript library to generate a lightbox with animated and responsive images. BaguetteBox is a JavaScript library, that generates a lightbox with animated and responsive images. And it also supports swipe gestures on touch-screen devices. Official site: GitHub - feimosi/baguetteBox.js: Simple and easy to use lightbox script written in pure JavaScript zap: Simple and easy to use lightbox script written in pure JavaScript - GitHub - feimosi/baguetteBox.js: Simple and… github.com How to use it? Step1: Install with npm, yarn, bower, or CDN npm install baguettebox.js --save yarn add baguettebox.js bower install baguettebox.js --save or, <link rel="stylesheet" href=" https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.8.2/baguetteBox.min.css "> <script src= https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.8.2/baguetteBox.min.js " async></script> Step2: HTML The content is inside the  gallery . Every image is in  <a> tag ...

  A list of React components and JS plugins to add infinite scrolling functionality to your projects. Photo by  Reuben  on  Unsplash When browsing blogs or the news, it’s common to find the infinite scroll function, which is seamless, and no need to refresh the page for more content. The better the user experience, the more customers you end up catching. There are several React components that can be applied when building your projects. egjs/react-infinitegrid egjs-infinitegrid/packages/react-infinitegrid at master · naver/egjs-infinitegrid A module used to arrange card elements including content infinitely on a grid layout. … github.com It’s a React component that can arrange items infinitely according to the type of grids. More demos can be found here: Storybook Edit description naver.github.io Documentation: Installation | InfiniteGrid Using the package managers (recommended) naver.github.io Features: Fully written in TypeScript. Comes with a rich API. Inserts inf...