Posted in
6360
6:20 am, August 31, 2018
scrollbar replacement simplebar
a nice and simple scroll bar replacement
code
<link rel="stylesheet" href="https://unpkg.com/simplebar@latest/dist/simplebar.css" /> <script src="https://unpkg.com/simplebar@latest/dist/simplebar.js"></script> <style> .scroller-no-pad { height:160px; width:300px; border-radius:5px; }</style> <div class='scroller-no-pad' data-simplebar>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis rutrum sapien non ornare sagittis. Fusce quis dignissim felis. Pellentesque iaculis nisl et est ultricies, id mollis lorem volutpat. Praesent nec nunc vel quam facilisis scelerisque a ut orci. Sed sed enim vestibulum ex commodo venenatis vitae in mi. In eu velit sed nunc euismod tempor ac at odio. Mauris sit amet mi ac turpis rutrum congue sit amet id nunc. Cras vel ligula a elit pretium convallis. Nunc ac nisl nisi. Vestibulum ut ullamcorper nibh. Phasellus dictum nisi quis ullamcorper finibus. Phasellus fringilla purus ut augue varius vulputate. Nullam nec nisl dignissim, varius sem pretium, commodo orci. Cras tortor nisl, pharetra sodales lobortis a, vestibulum ut libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla facilisi. Pellentesque rutrum urna elit, sed cursus felis placerat efficitur. Curabitur tempor velit magna, mollis malesuada risus lacinia sed. Mauris tristique id mi et cursus. Quisque consectetur velit in lacus euismod scelerisque. Vestibulum ac malesuada libero, eget auctor turpis. Integer pellentesque a ipsum non faucibus. Quisque ultricies sapien ut tellus bibendum aliquam. Nunc mattis a justo id bibendum. Cras sit amet nisl ac augue dictum finibus at at odio. Mauris massa elit, fermentum sit amet eros ut, aliquet fermentum orci. Vestibulum eleifend sapien quis lorem gravida scelerisque. Pellentesque lobortis velit metus, nec semper eros dapibus quis. Nunc lacinia iaculis tristique. Praesent aliquet dignissim eros vitae semper. Sed suscipit ultricies dignissim.</div>
add css and js to wordpress theme functions
wp_enqueue_style( 'simplebar-style', 'https://unpkg.com/simplebar@latest/dist/simplebar.css' ); wp_enqueue_script( 'simplebar', 'https://unpkg.com/simplebar@latest/dist/simplebar.js', array(), '20151215', true );
demo
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis rutrum sapien non ornare sagittis. Fusce quis dignissim felis. Pellentesque iaculis nisl et est ultricies, id mollis lorem volutpat. Praesent nec nunc vel quam facilisis scelerisque a ut orci. Sed sed enim vestibulum ex commodo venenatis vitae in mi. In eu velit sed nunc euismod tempor ac at odio. Mauris sit amet mi ac turpis rutrum congue sit amet id nunc.
Cras vel ligula a elit pretium convallis. Nunc ac nisl nisi. Vestibulum ut ullamcorper nibh. Phasellus dictum nisi quis ullamcorper finibus. Phasellus fringilla purus ut augue varius vulputate. Nullam nec nisl dignissim, varius sem pretium, commodo orci. Cras tortor nisl, pharetra sodales lobortis a, vestibulum ut libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla facilisi. Pellentesque rutrum urna elit, sed cursus felis placerat efficitur. Curabitur tempor velit magna, mollis malesuada risus lacinia sed. Mauris tristique id mi et cursus. Quisque consectetur velit in lacus euismod scelerisque. Vestibulum ac malesuada libero, eget auctor turpis. Integer pellentesque a ipsum non faucibus. Quisque ultricies sapien ut tellus bibendum aliquam.
Nunc mattis a justo id bibendum. Cras sit amet nisl ac augue dictum finibus at at odio. Mauris massa elit, fermentum sit amet eros ut, aliquet fermentum orci. Vestibulum eleifend sapien quis lorem gravida scelerisque. Pellentesque lobortis velit metus, nec semper eros dapibus quis. Nunc lacinia iaculis tristique. Praesent aliquet dignissim eros vitae semper. Sed suscipit ultricies dignissim.
links
View Statistics
This Week
165
This Month
836
This Year
1887
Add Comment
Other Items in js
jqueryui date selector with examples and code with custom date formatting
fancybox youtube showing video links in a lightbox - updated with fixed code parts
fix for Uncaught (in promise) Error: reCAPTCHA placeholder element must be empty
enable tinymce on a target textarea by id
Generate Random Whole Numbers with JavaScript Function
Generate Random Fractions with JavaScript
jquery document ready
make clickable element with clickable class
using getElementById and innerHTML to change the html of content no jquery
preserve tabs in textarea when tab key is pressed
jqueryui includes css and js
using vue and json data
jqueryui date selector with examples and code
jquery accordion
fancybox youtube showing video links in a lightbox
jquery jqueryui vue script includes
get select option form value with jquery
show the year with js
jquery clone and append elements
stacktable jQuery plugin for stacking tables on small screens
load content with jquery
find all elements add class jquery
digital clock with jquery
using regex with replace to replace all instances of something in a string
random string generator guid
set and check a cookie using js cookie
validate email address from string
check length of element jquery
access hacker news json firebase api via jquery
testing chartjs
clipboard copy js
tiny mce editor tinymce
do something later with settimeout or loop with setinterval
validate form data using javascript to check required html elements
mithril testing
parallax js scroll testing
change the water colour in google maps for an already initialised map
scrollbar replacement simplebar
load google sheet data into json string with jquery
change favicon with jquery
add this
Slick Slider Carousel
change the window title
flems embed in url
detect window scroll position jquery
truncate string using jquery
round number with js
google map with overlay data
Related Search Terms
Other Categories in Code
alpine js apps c css factorio font awesome images linux quick modals sqlite site bugs site updates slick slider sliders testing windows apps apache api apps asp bat bootstrap bootstrap templates charts cookies core css css filters css grid design elements docker domains emoji fancybox fonts foundation framework gimp git html icons ideas image formatting images javascript javascript functions jquery js linux mac misc modals mysql nginx node php php errors php function php functions php simple html dom pi400 python react regex sections simple_html_dom simplepie php site bugs site documentation slick slider sql sqlite ssh sublime svg svg css templates tools virtual box vscode vue webdev windows windows 11 windows commands wordpress