Search
Search Code
Auto Changing Image URL
Here is a picsum url that you can use to generate image sizes, just change the numbers in the url to change its generated size. Some examples of the sizes you can use are below.
show the current date in javascript
Returns the current date and time and sets the value in a div. Also added a demo with setinterval to update the time and date in the div every second.
set a cookie on click and then check if the cookie is set and dont show that message again
this script shows a message, and if the message is closed it will set a cookie to not show that message again for 1 day. The cookie in this example is set to expire in a day, so then if you com..
How to record your own page views with PHP, and make them into weekly monthly and yearly charts
Building a better Simple Page View Counter Currently this site has a very basic view counter on it. Here is how it currently works. Load the page, function checks if the page has a existing r..
how to view a web page in its printer format
if you have to check a website in its print or @media print format this is how you can emulate it in browser if you are using chrome or edge. Open the Dev Tools (usually F12) Click the menu ..
ajax callback to delete with sweet alert confirmation to make it cool! 😎
I recently wanted to to an ajax call back on a list of items just to make it easier to move around the place, rather than it reloading the page every time. So i thought why not also use sweet alert on..
set active class based on url value
this will check the full url and then loop through all the a elements in #test-div when it finds a matching url it will add the class active to that button this is good for persisting active links o..
add click event to multiple link items and load the link content into a target div ajax
this will get a group of links with existing href targets and load them dynamically with an ajax callback you will need to also include the full jquery script as the slim one does not include the aja..
add click event to multiple link items
this allows you to get every a element in a-div class and stop the link from loading, so you can do other things with it like run a function or something else Functions used: Javascript Wait for th..
add a youtube video preloader function, lazy load youtube [fixed]
I noticed that this list page: https://kruxor.com/list/rs3_efficient_skill/ Loads about 29 (well exactly 29) youtube video embeds and was wondering if there was an easy way to replace these iframes w..
checking the current url and then marking a link active based on that url
i want a script that can check the current page uri and then match it to a list of links to be able to add an active class that survives page reloading So here we go... 1. Get the current page url. ..
play a sound every # of seconds
This plays a beep sound every # of seconds, to stop it just reload the page 4 Minutes is 240 4.5 Minutes is 270 5 Minutes is 300
Fix Hover Over color on list group dark mode in bootstrap
How to fix the problem when switching to dark mode, the list group item text disappears when active. Here is what it currently looks like. To fix this we need to target the element and force the..
extracting the useful bits of bootstrap
Back in the early instances of bootstrap they used to provide a build system for the individual components. It seems that these days its all or nothing, or use some kind of build tool to include the b..
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.
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 ..
google map with overlay data
Ever wanted to add a really slightly complex google map to your site? Working Example /* Always set the map height explicitly to define the size of the div * element that con..
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 and..
set and check a cookie using js cookie
this library makes setting and checking cookies so easy its amazing! include this script <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/js-cookie/2.1.4/js.cookie.m..
meta refresh reload page
this can use a meta tag to get the browser to reload the current page. the following code will reload the page every 30 seconds. usually you have to add meta tags into the header of your page, not ..
video embed tag
to embed a video in a web page example Video not suported, download it here. code <video width="100%" height="340" preload="none" poster="myImage.jpg" autoplay loop controls&g..
css grid sidebar main content fluid layout with fallback
this is a continuation from the original post with added fallback for older browsers that do no support the grid elements yet. I have tested this fallback in IE11 and it seems to work well, if you wa..
more complex responsive tables css
i did a simple version of this before here but now im going to make it a bit more complicated and functional. table { width: 100%; border-collapse: collapse; } tr:nth-of-type(odd) { ..
