List Code
Radial Click Effect
shows the radial click effect like in the material design, so when you click a button it will show a click at that area with a nice animation. Uses CSS and javascript to generate this effect.
template for testing and live reloading html files
this is a template that i use while testing flat html files, if you add it to a server it will live reload. this does seem to cause issues depending on the site that is is used on, like reloading all ..
Custom 12 Grid using CSS Grid
For a while i have been using frameworks for their easy grid systems, like foundation and bootstrap. I guess this is a bit lazy and very bloated as you are loading the full css library and using about..
get the current url in javascript
this will get the current address add it to a variable and show it on the result element
split a string into an array using split javascript
this will split the string into an array based on the spaces inbetween words. you can split it based on any character, for example if you had words in csv comma format you could use the second example..
Generate Random Whole Numbers within a Range
My testing for generating a random whole number within a range... 🤞 While the solution here works, it just loops until it gets a random number that is lower than the max, so not sure if this is th..
Using parseInt in a function to return an integer or not
this function uses the parseInt function to return a proper integer or an error code if it can't. So this demo should return NaN for the Not an Int (x1235) and The int for the 00001235. I think that N..
Use the parseInt Function with a Radix
This is the same as the parseint function, but you can also specify a base for the number which can be between 2 - 36. 2 is binary. Zeros and Ones. I think base 10 is the normal numbering system, but ..
js - Use the Conditional (Ternary) Operator
this statement can be used instead of if this else that statements. to me it makes it look a bit more complex when reading it. this is the basic syntax. condition ? statement-if-true : statement-if-fa..
Use Multiple Conditional (Ternary) Operators
I actually find if then statements much easier to read than these ones, but these seem more efficient.
using let rather than var
Using let rather than var and use strict can avoid some overwriting of variables i will write a function here that shows how let throws an error. This function now gives an error in the console. Uncau..
using let and const example
This example uses let and const rather than just vars, let can only be declaired once rather than overwritten like vars and const is a read only variable so it cant be changed.
return a state name from an australian postcode
this will return an australian state code based on the postcode, so you can enter a valid postcode and see which state it belongs too. e.g: 2000 should return NSW
Changing an array declared with const
a const means that you cannot re-declare the variable name, but you can still mutate an array content that is declared as a const. so you can see in the following example that even though the array is..
Prevent Object Mutation
This shows how you can lock an object so its content cannot be modified. if you comment out the line Object.freeze(my_object); it will allow it to be modified again.
using arrow functions to convert small functions into one line statement functions
in this exercise i will take a function variable and write it in one line using the arrow function
Writing Arrow Functions with Parameters
you can pass parameters to arrow functions as well as shown in the following demo, these functions are only meant to be used once where normal functions can be re-used.
Complex Arrow Function Example
Here is an example using a Complex or Higher Order arrow function, which slightly reduces the amount of code lines used. This should return the square root of all positive integers passed into it.
Default Parameters for Functions
You can pass in default parameters for functions so that if the function is used with no parameter it will use the default one.
Using the rest operator to pass in a variable amount of arguments
If you don't know how many parameters you will need in your function you can use the rest operator to pass them in. ...
Using the Spread Operator to Evaluate Arrays In-Place Tests
My tests using the Spread Operator rather than the apply function. In the 1st function show_max_array i use the apply operator to convert the array into comma seperated values. In the show_max_array..
Using Node to get a Web Dev Environment with livereload up and running
this is how i get a live reloading dev environment up and running on my windows pc's using node , npm and browsersync.
Generate a Random User Name
a function that will generate a random user name from a list of user names
add google captcha to enable and disable a form button
This will check if the google checkbox is checked and then enable or disable the form button depending on the outcome. This is just a basic version of this check, you should also check that the captu..
php convert date now into a sql timestamp
an easy way to get the current date from php into a mysql or sql timestamp format, this uses the server time
js using recursion to create a range of numbers
in this we will create a function that calls its self to add to an array a range of numbers
jquery enable and disable attribute
enable and disable an element
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
how to display a php file as html with php
you can use the following function to show a php source file as html
php mysql table exists function
this checks if a mysql table already exists in the selected database and returns true or false
how to unzip in linux
How to easily unzip in linux sudo apt install unzip unzip myzip.zip done.
center something with css not using flex
This is how you can center something in another element if you dont want to use the flex method. You will need the relative position on the outer element, and the absolute on the center one unl..
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.
Get the documentURI with JS
This function gets the current document URI assigns it to the variable documentURI so it can be reused and shows it in the result area once you click on run function.
Use Recursion to Count Down
just a slight change to the count up version of this, using unshift rather than push to the array.
Use Recursion to Return a Range Array
using recursion to return a range array between the two numbers added
ES5 vs ES6 Object Example
here you can see the syntax changes between ES5 vs ES6 Object declaration, you can still access the values in the same way.
ES6 Nested Object Example
extracting variables from a nested object with new variable names
wordpress get page content to display on template page
gets the page content and displays it on a template, this must use the post loop as shown in the code.
using css linear gradient for background overlays
a few examples using css linear gradient for the background
load a youtube video in a fancybox modal
With just a couple of lines of js and html you can load your video links in a modal lightbox. Get the latest version of the fancybox scripts (just the links) from here: https://cdnjs.com/libraries/fa..
pulsating dots - glow glowing
a column of pulsing dots using css keyframes animation
Nginx Server Block with Rewrite
Nginx Server Block with Rewrite Here is a basic nginx server block with rewrite to the index.php file. So it takes all the parameters and passes them into the index, into the variable $p or $_GE..
Load and Unload TinyMCE editor from a button
Enable TinyMCE Disable TinyMCE Some Content function load_tinymce(idclass) { tinymce.init({ selector: idclass, plugins: [ "spellchecker code aut..
Find Disk Space Usage using DU
The easiest way to check the space used in a directory in linux is this command: du -h This will do the current directory and all its sub directories. if you want to see a specific one type this d..
force existing link to open in a new window with javascript
here is some javascript that grabs an existing link and then forces it to open in a new tab when clicked.
use javascript to open a link in a new tab or window
im not sure why you would use this rather than using the html target="_blank" but it could be useful if you needed to open a new tab in a javascript function.
making var_dump look nice
i was var_dumping an array the other day, and it comes out like a massive string you cant read. a fast way to make this readable is just to add some pre tags to it.