Manipulating CSS pseudo-elements using jQuery (e.g. :before and :after)

(original source from Stackoverflow, answer written by Blazemonger )

My situation:
I’ve a CSS file and I need to dynamically change the values of .is-selected:after and .is-selected:before from Javascript based on the user selection.

Here is my code

.is-selected {
    position: relative;
.is-selected:after, .topUp .is-selected:before {
    top: 85px;
    left: 0;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
.is-selected:after {
    border-color: rgba(136, 183, 213, 0);
    border-top-color: #9C2AA0;
    border-width: 31px;

    width: 1px;
    overflow: hidden;
.is-selected:before {
    border-color: rgba(194, 225, 245, 0);
    border-top-color: #ffffff;
    border-width: 38px;
    margin-left: -6px;

After few tries I’ve realised I can’t manipulate them because it’s not technically part of the DOM and therefore is inaccessible by any JavaScript.
However, I’ve found and here reported from an answer in Stackoverflow, written by Blazemonger, few alternatives to do it.
Continue reading

The paradox of the Infinite Scrolling and the Footer


What we are going to talk about is not a technical error but a wrong approach, a contradictory implementation choice.

Let’s think about the general structure of our web system. We have the classic Header for our web system where we usually put main menu, table of contents, main links and other relevant objects for the users. We also have the Footer where we can repeat some main menu links and put some more information like About us, T&C, Copyright etc.

We have, obviously also the Content that, in case of the home page, it could be the list of all articles ever written. But wait a second, we can’t load billions of articles all at once, so, let’s split them in blocks. The pagination could be a valid solution but we want something better, nicer, more dynamic..

The infinite scroll could be a good alternative, so the user just scrolls down the page and a bunch of articles are automatically loaded and magically appearing with a fancy fade in effect or maybe a slide down.

Here we are, do you see the paradox?
Let’s look at that together.
Continue reading