This plugin allows you to stick toolbar for summernote editors.

Related tags

Learning resource summernote-sticky-toolbar
Overview

Summernote Sticky Toolbar

This is a simple plugin for Summernote that makes the toolbar sticky.

preview.mp4

Installation

Classic

Include the plugin script after including Summernote:

<!-- include jquery, bootstrap, summernote here -->

<script type="text/javascript" src="summernote-sticky-toolbar.js"></script>

Via npm

Install sticky toolbar plugin trough npm:

npm install summernote-sticky-toolbar

Configuration

Enable and configure the sticky toolbar plugin.

$('.summernote').summernote({
    stickyToolbar: {
        enabled: true, // enable/disable sticky toolbar
        offset: 0, //y offset from top
        zIndex: 9999 //z-index of the toolbar
    }
});

Please do not forget to star the repository if you like it!

You might also like...

A JavaScript Library for building custom text editors with ease 📝

A JavaScript Library for building custom text editors with ease 📝

A JavaScript Library for building custom text editors with ease Show your support! Scriptor.js This is a bare bone text editor library, meant to creat

Oct 12, 2022

CodePlay is a Web App that helps the user to input HTML,CSS and JS code in the Code editors and display the resultant web page in real-time

CodePlay is a Web App that helps the user to input HTML,CSS and JS code in the Code editors and display the resultant web page in real-time

CodePlay A codepen clone Setup Clone repository Create and go to the directory where you want to place the repository cd my-directory Clone the proj

Sep 24, 2022

The to-do list project is an app that allows users to successfully organize their day by inputting prioritized tasks. The project also allows users to carry out the CRUD operations for (add, edit and delete). Two special features of the app are that it saves tasks in the local storage of the user's browser, so when the user reloads or revisits the app, the user can view a list of tasks formerly inputted, and it allows users to prioritize their tasks by dragging up and down the list section.

The to-do list project is an app that allows users to successfully organize their day by inputting prioritized tasks. The project also allows users to carry out the CRUD operations for (add, edit and delete). Two special features of the app are that it saves tasks in the local storage of the user's browser, so when the user reloads or revisits the app, the user can view a list of tasks formerly inputted, and it allows users to prioritize their tasks by dragging up and down the list section.

TO-DO-LIST This is a To Do List Project that dynamically displays tasks to be done with interactions for removing and adding task when completed or no

Nov 1, 2021

App that allows you to control and watch YouTube videos using hand gestures. Additionally, app that allows you to search for videos, playlists, and channels.

App that allows you to control and watch YouTube videos using hand gestures. Additionally, app that allows you to search for videos, playlists, and channels.

YouTube Alternative Interaction App An app I made with Edward Wu that allows you to search and watch videos from YouTube. Leverages Google's YouTube D

Dec 28, 2021

To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. I build a simple website that allows for doing that, and I do it using ES6 and Webpack!

To-do list

Project Name : TO-Do list "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mar

Aug 22, 2022

This is the version to be reviewed - "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. A simple website that allows for doing that, and built using ES6 and Webpack!

Todo-list "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as comple

Dec 20, 2022

Obsidian.md plugin that allows you to link multiple bible verses easily

Obsidian Bible Linker Plugin for easier linking of multiple bible verses in Obsdian.md note taking app. Usage Use command "Add biblical link" or click

Dec 27, 2022

This plugin allows you to track the progress of Atlassian Jira issues from your Obsidian notes.

This plugin allows you to track the progress of Atlassian Jira issues from your Obsidian notes.

Obsidian jira-issue This plugin allows you to track the progress of Atlassian Jira issues from your Obsidian notes. Usage Configuration Use the plugin

Dec 30, 2022

A simple and useful jquery plugin that allows you to create a Text Area Character Count Effect with limited warning.

A simple and useful jquery plugin that allows you to create a Text Area Character Count Effect with limited warning.

jquery-character-counter A simple and useful jquery plugin that allows you to create a Text Area Character Count Effect with limited warning. #Demo Us

Dec 28, 2020
Releases(v1.0.1)
Owner
İlyas Özkurt
Open source based data miner, php developer
İlyas Özkurt
GitHub
An obsidian toolbar plugin, modified from the Cmenu plugin

obsidian-editing-toolbar Plugin Thanks to the cmenu plugin, which gave me a lot of inspiration, but this plugin has not been maintained for more than

null 321 Dec 29, 2022
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022
Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 4 May 3, 2022
Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

null 14 Jan 3, 2023
Mike North's "Making TypeScript Stick" course.

Mike North's "Making TypeScript Stick" course.

Mike North 24 Oct 30, 2022
A lightweight, performant, and simple-to-use wrapper component to stick section headers to the top when scrolling brings them to top

A lightweight, performant, and simple-to-use wrapper component to stick section headers to the top when scrolling brings them to top

Mayank 7 Jun 27, 2022
H1-H5 headers stick on content scroll

"Sticky Headers" plugin for Logseq h1-h5 headers blocks (which have child blocks) on the page will "stick" to the top when the page scrolls, helping y

Yuriy Piskun 13 Dec 15, 2022
"To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. You will build a simple website that allows for doing that, and you will do it using ES6 and Webpack!

To-do-list Description "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark t

Cindy Dorantes 12 Oct 18, 2022
The language service that powers VS Code's Markdown support, extracted so that it can be reused by other editors and tools

VS Code Markdown Language Service ❗ Note this project is actively being developed and not yet ready for production use! The language service that powe

Microsoft 369 Dec 30, 2022
Functions and objects that make it easier to add fields to Portable Text editors for accessibility meta information, like language changes or abbreviations.

Porta11y Porta11y is a collection of accessibility-focused annotations, decorators and validators for Sanity’s Portable Text editor. Portable Text is

Hidde de Vries 21 Aug 25, 2022