jqueryui date selector with examples and code with custom date formatting

Datepicker using jquery ui with current date and date formatting. as dd-mm-yy Example Date formatting with selector  

wordpress jquery find and replace option text value

renames the Select Category in the option value 1 to Topics add to the footer, uses jQuery rather than $ but you can just switch to $ if not using the wordpress jquery init. 

add a custom event trigger in jquery document ready

i saw something that said if you add an event listener at the end of the doc ready it should fire last, but i dont think this is correct as it runs everything at once. so i think this code does not wo..

jquery load wait function

load something in jquery, wait for it to load then do something else

javascript attach a click event to an id not using jquery

I just wanted to bind a click to a button, not using JQuery, turns out its not that hard at all. Why am i using jquery for this stuff???...

add a toggle with jquery and change the class

With this code I just wanted a quick bit of inline code that could add a toggle to an element or multiple and also switch its class to make it show that the item is toggled on or off.  Here is t..

load json data url with jquery

loads a api or json url or endpoint using jquery and console logs the result Tested working on my test json file, check the console and it should be there. 

validate email address from string with jquery working function

Here is a working example of this post validate email address from string. This has very basic checking of an email address by checking that the string has an @ and a . in it. Note: this is still no..

mouse enter mouse leave jquery hover hoverout

showing how you can do things on mouse over and then something else when the mouse leaves an element using jquery

simulate a click on an element with jquery

you can actually use jquery to simulate a click event using the following .click() so as soon as the document is ready and you have jquery loaded it will run the click event for you, and should pop ..

jquery check if a sub element exists

this can be done with .length

jquery toggle menu testing

using jquery toggle to show and hide the sub menu's

load json with vanilla javascript no jquery

this basically does the same thing that a jquery .getJSON does but without the need for jquery.

json load from jquery and loop through the results

this is the same as this post but i have added the object to an external test file. so rather than already having the object data on the page we have to load it somehow Note: you can test that the o..

json jquery ajax request

get json data with jquery using getJSON

jquery page search [testing]

just testing this one at the moment for a in page search.  Based on this: https://codepen.io/chriscoyier/pen/ExgqWab  I would like to adapt this code to search through page elements and ma..

How to add jquery to squarespace site

I dont use square space, but if i did and i wanted to use jquery in it. This is where i would add it... ;) Settings > Code Injection > Header Then add your script, like this one:

add a jquery date picker to your text box

This JQuery UI Date picker is good if you want to add a nice dropdown date selector to your input box, rather than having to type in the date manually. Requires: JQuery  JQuery UI Documen..

replicating the bootstrap dropdown toggle in jquery

here is a code that can toggle a sub element using the same format as bootstrap. Update: also added another line that closes all the open menu's when one is clicked, so that you dont have a bunch of ..

using jquery appear for checking if an element is visible on screen

Yes.. sometimes i like using jquery as well, as it can make things so easy! :) Here is a quick demo using the JQuery Appear plugin so make an element change if it on or off screen.  Plugin Link..

Custom JS Tabs - No Jquery or Jquery UI

find and replace hrefs in existing page links using jquery

sometimes i have to do these things when you cant change the source files for some reason, usually due to old code. Its kind of a patch, but it works. The reason i had to add a delay in running the fu..

get the href value using jquery

this uses the jquery attr function to get the value of the href. this example targets the first a in the card div, so running the demo should alert you with https://kruxor.com Rather than using alert..

jquery document ready with foundation init as well

here is a jquery document ready that also loads the foundation js library. im not sure if the document foundation needs to be loaded in the document ready, but this way seems to work.

jquery add a click function if the window size is greater than target_width

this function will add a click event to the target if the window size is greater than the target_width

jquery enable and disable attribute

enable and disable an element

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 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 favicon with jquery

Updated: This seems to not work on this page, as it has multiple link icon elements to deal with different sizes. I just changed it to a function and it runs ok, but the browser seems to choose a diff..

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..

document ready wordpress jquery

Wordpress uses JQuery rather than $ to initialize so here is a workaround that allows you to still use the $ to access JQuery functions. Just incase your normal document ready is not working. tags: ..

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

This jquery function clones an element and appends it to another one.  Here is the basic code: $( ".clone-me" ).clone().appendTo( ".append-me" );I also updated this to work with just raw js, so..

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..

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 with examples and code

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..

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 });