Search
Search Code
React - Use State to Toggle an Element
Mastering React State: Toggling Elements with Confidence React's state management system is a powerful tool for building dynamic and interactive user interfaces. One common use case involves to..
css cursor types testing
testing all (most) of the available css cursor types, you can mouse over to test how the cursors react depending on your browser type and operating system. refs https://developer.mozilla.org/e..
CSS Object Fit for Image fill rather than using background image on a div
CSS Object Fit can crop off the sides of an image, while also preserving its aspect ratio, and then fill in the space to fit any size. Object Fit You can use: object-fit: With the following ..
Welcome Widget Card - Toggle
Testing the welcome widget with a more or less toggle. This version seems to work, with a jquery slide toggle.
Playfair Display Font Quick Embed - Google Font Quick Embed
Note: you only need the @import in css or the link href not both to embed this font. This font reminds me a bit of Times New Roman
Hello world in C and seeing what it is actually doing
One of the most simple C applications, how to compile it and how to objdump it. C #include int main() { int i; for(i=0;i < 10; i++) { puts("Hello Mac\n"); } return ..
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..
how to embed google fonts icons
For some reason when i go to embed a google font icon, they dont seems to have any obvious way to actually use it, i can find the icons ok here. But then when i go and use it it links to a how to embe..
sqlite fetchArray into another array
was having an issue when trying to return a multi array using sqlite over multiple rows. Stack Overflow Inspiration I tried a few of these but it was not incrementing key, and also it was only..
react basic hello world
the most basic hello world using react js
center mode slick zoom testing
update : this is a tricky one to get working! I have done a lot of testing on this one, and got a demo working from a combination of the following links. the demo is still not 100% styled, but its..
add some foundation tabs working example
they show the tabs here on the example page, but there is no full working code... for some reason. So i thought i would add one here. Hmm foundation makes this site look weird, and very bright! :P ..
Scroll down indicator css javascript and html
I have seen these a couple of times, indictating to the user that there is further content down the page, and they should scroll to view it. Then as you scroll down the indicator dissapears. So we w..
counting the occurrence of words in a multidimensional array
array sorting example The array Array ( [0] => Array ( [0] => Some [1] => great-looking [2] => special [3] => editio..
json test objects (or arrays)
here is a couple of test objects in external js files just in case you need to test some ajax loading functions or need external objects, i mostly use them in my testing. Basic JSON Object with 3 ite..
using text-stroke to add a border to your text
this is quite good for webkit enabled browsers, and most of them are these days. Check what is supported: https://caniuse.com/?search=webkit-text-stroke
my default text shadow css
just a quick copy and paste for easy text shadow that fits in most places
top bar overflow issues [fixed]
So i was just browsing throught the site checking for random errors, which there are quite a lot. And noticed this one. Quite a large bug caused by overflow issues in the main header, i think this ..
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..
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..
Core Class - Basic Core Structure
A Core class that can be used as a base for all content types and uses the extend classes to define the database variables. So basically you can set up core class and then create sub extend classes to..
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..
flems embed in url
Flems.io is a single-file, embeddable Web sandbox. It keeps all its state in the URL, so just make your changes, copy the URL from the address bar, and send it wherever you please. Most popular link s..
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..
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 ..
jquery document ready
The most used script in jquery, loads things after the document is ready. $(document).ready(function(){ // do some stuff });
check the server method post or get using php
Here is a basic usage method for checking if the server is in post or get mode. most normal pages are served in get mode. You can send data back to a page using get by adding variables to the string ..
