Today I came across this amazing post from the Developers at Mozilla called “Re-Introduction to Javascript” that helped me better understand (I hope 😅) what are the object prototypes in JavaScript and how to use them 🎆. But let’s have a look at an example to see this in action.
Continue reading “JavaScript objects and how the Prototype works”Category HTML / JS / CSS
Upgrading to Twig 2
Doing a major version upgrade is always fun so this is no exception. I use Twig for my PHP projects so I run into multiple little snags whilst upgrading to version 2. I have listed the most interesting ones here with the errors I was seeing and the recommended updates:
- macros defined in parent templates
- the spaceless block
- nested blocks in other statements
JQuery textarea text limit counter
This is slightly different implementation of the jquery textarea text limit counter found at: http://www.scriptiny.com/2012/09/jquery-input-textarea-limiter/. The main difference is that the user is not cutoff when he reaches the limit of the allowed characters but he is notified via the counter that his text is longer than expected.
The idea behind it is to have a textarea that accepts user input and there is a limit in the characters that you want you are allowed to type in the textarea. While you type in characters in the textarea a counter is updated that shows the remaining characters. The number is correct even when you reload the page and the area is pre-populated with text. This particular demo uses jquery 1.5.1
Continue reading “JQuery textarea text limit counter”Relatively positioned elements: How to remove white space
Positioning elements in HTML with CSS creates some problems when rendering the elements to be presented on a website. For example I came across this common problem with relatively positioned elements:
if you relatively position an element an empty space is created in the place where the element was supposed to normally appear
So how can we remove this white gap?
In order to examine this issue let us create an html page with 3 divs. One outer div which includes 2 other divs (div A and div B) and some text that follows the outer div. You can use the following html and css code to reproduce the result presented in the following image. I have chosen to set the background-color of the divs so we can easily identify them.
\Read more