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..
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
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 ..
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; ..
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..
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.
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...
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..
console dir usage
the console.dir function shows a list of the properties or the target object. Usage console.dir(variable); Result Example
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
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..
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.
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..
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..
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.
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.
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..
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..
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!
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 $..
change the box-shadow of an element with javascript boxShadow
changes the box shadow of test_div using the javascript object(?) boxShadow
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..
twitter json feed testing
just testing using the Twitter Post Fetcher script, seems to be working well.
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..
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 ..
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..
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..
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..
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
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..
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..
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..
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
ES6 Nested Object Example
extracting variables from a nested object with new variable names
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.
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.
getType function for js
this function returns the type of item, array object string number etc
Objects in javascript
creating and using an object in javascript, the full version of this testing is on codepen
asp classic get a url and display it
gets a url and displays it using XMLHTTP
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..
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..
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..
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..
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..
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..
Random Quote
