Search
document ready javascript standalone version no jquery
this is a version of a dom ready or document ready that does not require jquery
jquery click function
Bind something to a click event on an element using jquery. Needs to be combined with a document ready.
Change link target with JQuery
this will change the link href target to # on document load rather than its original link
wordpress enqueue slicknav and slick slider
add this to your theme scripts functions file here is the full one from HTML5 Blank // Load HTML5 Blank scripts (header.php) function html5blank_header_scripts() { if ($GLOBALS['pagenow'] != ..
wordpress include jquery in theme functions
Add this to your themes functions.php file, to include your own version of jquery. if (!is_admin()) add_action("wp_enqueue_scripts", "jquery_enqueue", 11); function jquery_enqueue() { wp_deregi..
wordpress register enqueue javascript require jquery
This usually goes in the theme functions file. This will load it after jquery if it requires it. wp_register_script('scriptname', get_template_directory_uri() . '/js/scripts.js', array('jquery'), ..
truncate string using jquery
.test { padding:10px;border:1px solid #999;border-radius: 3px; } so lets say we had the following string on the page and we needed to make it a bit shorter for some reason. like if you dont have co..
detect window scroll position jquery
This one adds or removes a class if the document is scrolled 50 px near the top of the window. $(window).scroll(function() { if ($(document).scrollTop() > 50) { $('nav').addClass('shrink');..
change the window title
This is a pretty easy one liner But we can make it a bit more complex with jquery and add a counter It is questionable that crawlers and bots will see this so may be bad for SEO. document.t..
change favicon with jquery
this one is good if you have a favicon that just wont change, this will make sure it changes with jquery. (function() { var link = document.querySelector("link[rel*='icon']") || document.crea..
load google sheet data into json string with jquery
Just discovered this the other day, you can actually export google sheets data into json format and load it directly into your site, how good is that. A free mini basic database! Initially i was lo..
mithril testing
https://mithril.js.org/simple-application.html example this example is not going to work without npm Adding Elements How to add a link using mithril with target _blank m("a[href=https://mithril..
json loop load elements
Loading json content from a url can be tricky, there are a few different things you need to watch out for. Here is some examples using an example json feed. Load the feed this will load the feed an..
document ready wordpress jquery
just incase your normal document ready is not working jQuery(document).ready(function($){ // do some stuff }); jQuery(function($){ // now you can use jQuery code here with $ shortcut fo..
access hacker news json firebase api via jquery
Just a getJSON JQuery Request that will console log all of the hacker news top stories using the firebase api $.getJSON('https://hacker-news.firebaseio.com/v0/topstories.json', function(json) { va..
check length of element jquery
this one can be good for checking if an element exists before doing something with it and can stop warning messages if you are running the script on multiple pages. if ($('#mydivid').length) { con..
digital clock with jquery
Just a simple digital jquery clock that updates every second. Also added the dropshadow animation, not sure why... ;) .digital-clock { font-size:80px; } .transition { transition..
find all elements add class jquery
this will grab all a elements, and dump them to the console. var allLinkElements = $( "a" ); console.log(allLinkElements); then we need to split into a jquery object, this is a jquery version of an..
load content with jquery
Load data from the server and place the returned HTML into the matched element. this one seems simple but very useful $( "#result" ).load( "ajax/test.html" ); this one will load the content o..
stacktable jQuery plugin for stacking tables on small screens
stacktable.js The purpose of stacktable.js is to give you an easy way of converting wide tables to a format that will work better on small screens. It creates a copy of the table that is converted in..
jquery clone and append elements
good if you need to clone and append... $( ".hello" ).clone().appendTo( ".goodbye" );
get select option form value with jquery
Handy if you need to get the value of a selected item in an option list basic code $("#select option").filter(":selected").val(); working demo Value 1 Value 2 Value 3 Value 4 ..
jquery jqueryui vue script includes
JQuery 3.2.1 <script src="https://kruxor.com/code/js/js/jquery.3.2.1.min.js"></script> jqueryui includes css and js JQueryUI 1.12.1 <script src="https://cdnjs.cloudflare.com/aja..
fancybox youtube showing video links in a lightbox
do people still use lightboxes, it seems yes in some cases. ;) if you feel the urge to use lightboxes and need to link to some youtube videos this is how you can do it. you will need jquery and fan..
jquery accordion
here is an easy drop in if you need a quick and dirty accordion sometimes you just need something quick, here is mine for the jquery accordion also changed the default selected tab to green rather t..
jqueryui date selector
This has to be one of the most used date picker items from jquery ui. And its usually the reason i even include jquery ui. Without using a theme this one looks pretty good. This version of it does n..
using vue and json data
Based on This Demo: https://jsfiddle.net/kkpLnv6k/ so i was looking through the jquery way of loading json data and was wondering what the point of loading it in with a vue.js instance is. I guess ..
jqueryui includes css and js
these ones are useful as well for including jquery ui JQueryUI 1.12.1 <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script> JQueryUI 1.12.1 min..
using getElementById and innerHTML to change the html of content no jquery
this is pretty simple, but i always forget it so ill add it here document.getElementById("theid").innerHTML = "the new content"; heres how it works, add a div with an id of theid Example .. <d..
jquery document ready
The most used script in jquery, loads things after the document is ready. $(document).ready(function(){ // do some stuff });
simple dropdown multi level navigation ul li css
updated to work standalone and not effect other list elements on the page
animate stuff detecting window scroll position
This is a bit of a continuation of this post. detect window scroll position jquery requirements animate.css detect scroll position jquery includes foundation essentials includes (jus..
css accordion basics
can we create an accordion with out using jquery ui? I think yes, it will be basic but also keeping it simple it probably a good idea. tried adding transitions to make the divs showing a bit smooth..