Search
Search Code
Search Code by entering your search text above.
js
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  

6:12 am, February 27, 2024
css
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 ..

3:47 am, February 23, 2024
image formatting
can you set all image heights to match with css no stretching

Short Answer: Yes with object-fit: cover; on the css of the image properties.  object-fit: cover; You might also need:  object-position: right bottom; ..

4:32 am, November 9, 2022
simplepie php
simple pie get link from enclosure item in simplepie rss feed

i had an item like this in a rss feed, and i wanted to grab the enclosure url, took me a while to figure this out for some reason even though the solution is quite simple.  PHP <item> &l..

4:33 am, September 29, 2022
javascript
Twitter Post Fetcher v18.0.4 - javascript twitter feed fetcher

A few queries showing how to get latest tweets and post likes using the Twitter Post Fetcher v18.0.4 script.

12:42 am, August 31, 2022
javascript
Twitter Post Fetcher Script

Uses javascript to fetch a twitter feed from a user screen name. Totally stylable alternative to using the twitter embed code. Your Welcome... 

12:43 am, May 3, 2022
javascript
Javascript Objects Notes

As javascript objects are used so often in javascript i thought i would write an overview and some notes on how they work, well how they work for me anyway. I guess how they work for me should be simi..

2:37 am, March 28, 2022
javascript
console dir usage

the console.dir function shows a list of the properties or the target object. Usage console.dir(variable); Result Example

11:25 pm, March 13, 2022
javascript
Create Strings using Template Literals

if you use the backtick to enclose your strings you no longer have to use \n for a new line.  For example: `this is a multiline ...string!!` Console Example

5:55 am, December 29, 2021
javascript
Use destructuring assignment within the argument to the function half to send only max and min inside the function.

this seems like a tricky one, can be resolved with removing the stats array reference. Im not sure how it still knows to access the stats array. I dont know how that is correct as the console just lo..

12:34 am, December 17, 2021
javascript
How to Assign the Value of One Variable to Another in Javascript

Showing a very basic script that assigns the value of the variable a to b and then console log's the object.

12:22 pm, December 6, 2021
javascript
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..

11:47 am, November 29, 2021
php
Fix for PHP Warning Trying to get property '*name*' of non-object

i was getting this error when checking parts of an object that were sometimes set and sometimes they did not exist depending on the values.  Warning / Error : Warning Trying to get property '*na..

8:53 am, October 28, 2021
javascript
load json data url or api with javascript

this loads a target json url or api using raw javascript so no jquery required with this one then logs the data returned to the console. 

4:43 am, October 26, 2021
jquery
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. 

4:36 am, October 26, 2021
react
How to Use PropTypes to Define Props in React

React allows you to define the types of props given to your components to make sure that invalid data is not sent as the prop to the element.  To do this you can define propTypes. You can defin..

4:40 am, October 19, 2021
react
How to use default props in React

If you dont want to specify props every time you use an element, you can also specify defaults for these items. This can also be useful to remember which props are needed per component. This can be a..

2:24 am, October 19, 2021
javascript
console table rather than console log for javascript objects and arrays

so i just saw on a tweet, that you can use console.table and i cant wait to try it out! good thing i already have a test object and array ready to go!  

8:36 am, October 8, 2021
wordpress
using wp_nav_menu to show a custom menu in wordpress

found this quick code snippit here, its not working just for reference of what the array items do.  Here is how you would display the menu called "Projects" PHP         $..

4:28 am, September 29, 2021
javascript
change the box-shadow of an element with javascript boxShadow

changes the box shadow of test_div using the javascript object(?) boxShadow

4:39 am, September 18, 2021
javascript
javascript update item in object

find something in a javascript array by its array id and then update the value of that item i changed this from an array to an object as i wanted to use something other than numbers for the index Ob..

3:58 am, September 16, 2021
javascript
twitter json feed testing

just testing using the Twitter Post Fetcher script, seems to be working well.

9:33 am, September 10, 2021
javascript
using clamp js to clamp lines of text

there is a css version of this as well but this version works in a greater range of browsers (i think) this one is not working for me... i think the overflow elipsis is still a better option than thi..

11:17 pm, June 22, 2021
css
make your images look non squished when not using image backgrounds v2

this is a working version of this post, for some reason that image was deleted I think due to a content upgrade.  Basically this uses the object-fit: cover; to make images not stretch when they ..

6:22 am, June 4, 2021
javascript
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..

12:22 pm, May 25, 2021
javascript
loop through a complex object json javascript

just a note to say that a complex object is an object with more than one nested object in it for example just kinda playing around with this one to get the handle on objects and how to access them C..

12:19 pm, May 25, 2021
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..

6:48 am, May 25, 2021
javascript
loop through object json javascript

this shows how you can loop through a javascript object using for if you check the console you can see the loop results

12:09 am, March 16, 2021
javascript
Monitoring Visible Objects on Screen

i found this one when researching how to detect visible objects on screen, and then doing something with them. This one does not use any external scripts to change the box colour as it becomes visible..

12:07 am, December 1, 2020
wordpress
wordpress get the current category id name and slug

This gets and displays the current category id in a wordpress blog post if you have the current id, if not you can leave the $post_id blank and it should see if there is a category loaded to the curre..

6:01 am, September 21, 2020
javascript
get element by class name with javascript and change it function

You may have seen the get element by id in javascript, which is great when there is only one element but what if you need to get the element using its class name The issue with classes is that they c..

1:59 am, June 17, 2020
css
wordpress main nav dropdown fix

this unsets the flex and allows the menu items to stack properly in a dropdown menu, not sure if this is reusable

3:47 am, May 27, 2020
javascript
ES6 Nested Object Example

extracting variables from a nested object with new variable names

1:09 am, February 3, 2020
javascript
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.

12:41 am, February 3, 2020
javascript
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.

11:16 pm, September 30, 2019
javascript
getType function for js

this function returns the type of item, array object string number etc

11:50 pm, July 29, 2019
javascript
Objects in javascript

creating and using an object in javascript, the full version of this testing is on codepen

11:25 pm, July 29, 2019
asp
asp classic get a url and display it

gets a url and displays it using XMLHTTP

12:08 am, March 20, 2019
php
get current class name with get_class

This will return the current class name, can be used in side a function of the current class object or give it another object name to return. class myclass {function myfunction() {echo get_class($thi..

3:37 am, October 22, 2018
javascript
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..

6:20 am, August 31, 2018
js
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..

6:20 am, August 31, 2018
js
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..

6:20 am, August 31, 2018
css
make your images look non squished when not using image backgrounds

Update: Fixed the code, you can see it here.  i deal with a lot of sites where they have a bunch of images listed and sometimes they can end up looking a bit sqashed unless you add a div and set..

6:20 am, August 31, 2018
css
set transparent menu over background image

this is probably obvious, but i found it useful for those themes that look nice with a semi-transparent header sitting over the top of an image. I think ill do this as an external example, as its eas..

6:20 am, August 31, 2018
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

Subscribe to weekly updates about things i have added to the site or thought interesting during the last week.

You could also follow me on twitter or not... does anyone even use twitter anymore?

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote
There is no way to happiness. Happiness is the way.
Unknown
Random CSS Property

@page

The @page CSS at-rule is used to modify some CSS properties when printing a document.
@left-bottom css reference