Search
Search Code
Testing Playwrite on for Node
I came across this library on y news, and thought id give it a bit of a test. I managed to get it working but not really sure what tests it can do. I set it to take a screen shot of a we..
Console Tips and Tricks
Here are some quick commands for the console. Getting to the console in your browser Press F12 and Find the console tab. That little blue > there is the console. this is in brave or chrome, bu..
ken burns slow image zoom
No i had never heard of Ken Burns either, but hey i like the zoom effects. Slow Zooom...
video not auto playing issue in chrome and brave
i had this error the other day when i was adding an auto play video to a page. the error was: Javascript Uncaught (in promise) DOMException: play() failed because the user didn't interact with the ..
bootstrap dark mode
Bootstrap Darkmode https://github.com/vinorodrigues/bootstrap-dark/blob/master/README.md#method-1 https://github.com/vinorodrigues/bootstrap-dark CSS Dark Mode Preparing for dark mod..
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 ..
old browser check with javascript
modified from this script i console logged all the items available so you can do what you need with them these are the avilable variables Javascript console.log(browser.agent);console.log(browser...
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..
How to set a cookie and expire it in 30 days
Here is some basic usage for the js cookie library. Include the following script. Or you can grab the latest version at the cdnjs website. HTML <script src="https://cdnjs.cloudflare.com/ajax/lib..
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..
Applied Accessibility - Access Keys
Access keys can be applied to link elements and in chrome you can access them by pressing ALT+ SHIFT + [accesskey] for some reason when testing this in chrome the a key was not accessible, but g 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..
copy image to data uri using chrome base64 encode
Update: 26 Aug 2020 - Fixed video and original image link all should be working now in chrome. Found this one useful if you want to convert an image to base64 encode and link it directly in css or ht..
take full page screenshot screencapture using chrome dev tools
This isnt really html, but its handy ;) Here is how to take a full page screen shot using the chrome dev tools. Open dev tools in chrome and the page you want to capture the image from F12 Pr..
video embed no controls
embed a video, for use as a background or a slide element, or wherever you need a large video. I found that there was a bug in chrome (which is probably fixed now) that was ignoring the autoplay tag ..
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..