HTML, CSS, JS

[Chris M]

This is one of those things that won't stay in it's allocated memory slot. This time I'm going to write it and then forget where I wrote it instead.

Using a placeholder to create a comparison slider, but the same applies to most of these things. Where does the following go? Page, Website, Placeholder, Body, Head???

HTML?
CSS?
JS?

The example I'm working on >>> Before After Image Slider (Vanilla) (codepen.io) <<<

[Acorn]

Placeholder Body
Head
Last

Mostly.

Acorn

[Chris M]

So...
HTML - Placeholder Body
CSS - Head (Placeholder, Page or Website?)
Last - Don't understand this bit at all. Not unusual though.

[Acorn]

So...
HTML - Placeholder Body
CSS - Head (Placeholder, Page or Website?)
Last - Don't understand this bit at all. Not unusual though.

Yes
Any of them
JS acts on DOM elements, they have to exist first.

I detailed all this once before. Still looking.

I thought I would try terse for a change.
It's just lazy as is not capitalising, failing to use punctuation, sentences and paragraphs.

The worst failing is assuming someone is inside your head.
A statement that can be taken in several ways.

I am still looking...

Acorn

[Chris M]

Got it. The penny dropped.

Yes, I'm sure this has been explained before more than once. It's one of those things that just doesn't stick. Probably because I don't understand how it actually works. I also don't use coding often enough, or diversely enough, to be anywhere near to fluent.

[Chris M]

And the penny dropped right off the edge and into oblivion.
Egg made one that works well, but doesn't have a 'click and drag' feature. I tried to work out what bit goes where and ended up drinking heavily and sobbing quietly.

Egg's version >>> before-after.xar <<<

The one I'm trying (and failing) to make work is from Code Pen, linked in post #1. I've tried numerous combinations of Page Head/Body, Placeholder Head/Body and even staring really hard at Acorn's steps didn't give me a result.

I've pasted the code as it appears on Code Pen, although I realise it can be trimmed. I've also started afresh and haven't placed the code anywhere except where you see it. If anyone can have a look and start the answer with "It's easy, what's wrong with you." I'd be a grateful little member.

>>> Comparison Slider.xar <<<