How to add customised css to CDN hosted ckeditor

Misc

Method 1 – Load CKEditor via CDN and Configure Custom CSS: <script src=”https://cdn.ckeditor.com/4.16.2/standard/ckeditor.js”></script> <script> CKEDITOR.replace(‘editor1’, { contentsCss: ‘path/to/your/custom.css’ });...

SplitType

GSAP

Split Type – https://www.npmjs.com/package/split-type SplitType is a small javascript library that splits HTML text into elements so that lines, words, and characters can be animated independently. It was inspired by GSAP’s SplitText plugin and can be used...

Lenis smooth scroll library with with GSAP

Library

Website – https://lenis.darkroom.engineering/ Setup – https://github.com/darkroomengineering/lenis?tab=readme-ov-file CDN Script <!– Lenis JS for smooth scroll –> <script...

Script to add emoticons in input on focused area

Misc

Demo See the Pen Script to add emoticons in input on focused area by Puneet Sharma (@webdevpuneet) on CodePen. Script <script type=”module”> import { createPicker } from ‘https://unpkg.com/picmo@latest/dist/index.js’; let...

Can I replicate ctrl ++ and ctrl — in a browser using buttons and click on it using javascript?

Misc

Replicating the functionality of Ctrl++ and Ctrl– using buttons in a browser involves a different approach. You’ll need to simulate the Ctrl key being pressed while clicking the buttons. This isn’t straightforward since simulating system-level key...

useGSAP REACT Hook

GSAP, React

Here is an example of using the GSAP library in REACT using the useGSAP Hook for seamless animation. DEMO See the Pen useGSAP by Puneet Sharma (@webdevpuneet) on CodePen. import React from “https://esm.sh/react”; import ReactDOM from...

React Hooks: useEffect

React

Here is a simple counter increase decrease example for React Hook – useEffect. useEffect runs at lease once and everytime dependency array changes when the component is loaded or mounted. See the Pen Codepen React Starter Template with Babel Transpiler by Puneet...