What secrets lie within? August 23, 2018 7:58 AM Subscribe
Wanna know something neat? Click here. ▼
MetaFilter supports the <details> tag. It's useful for spoilers.The <details> tag is not supported by Internet Explorer or Edge, which will impact like one dude or something
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:05 AM on August 23, 2018 [19 favorites]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:05 AM on August 23, 2018 [19 favorites]
Saw that - good job! The coding looks like:
<details><summary>[Click for spoiler]</summary>Take your stinking paws off me, you damn dirty ape!!!</details>
will show up as
posted by hangashore at 8:08 AM on August 23, 2018 [32 favorites]
<details><summary>[Click for spoiler]</summary>Take your stinking paws off me, you damn dirty ape!!!</details>
will show up as
[Click for spoiler]
Take your stinking paws off me, you damn dirty ape!!!posted by hangashore at 8:08 AM on August 23, 2018 [32 favorites]
Do we need a details button next to the B I link ?
posted by RobotHero at 8:12 AM on August 23, 2018 [4 favorites]
posted by RobotHero at 8:12 AM on August 23, 2018 [4 favorites]
How it do on Mobile?
posted by Freelance Demiurge at 8:13 AM on August 23, 2018 [3 favorites]
posted by Freelance Demiurge at 8:13 AM on August 23, 2018 [3 favorites]
A button would be cool, but there are probably other things that would get used more like strikethrough and underline. Maybe it should be kept slimmed-down? I'm not sure.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:14 AM on August 23, 2018 [2 favorites]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:14 AM on August 23, 2018 [2 favorites]
<details> works fine on mobile.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:14 AM on August 23, 2018
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:14 AM on August 23, 2018
|￣￣￣￣￣￣ |
| METAFILTER |
| IS |
| AWESOME! |
| ＿＿＿＿＿__|
(\__/) ||
(•ㅅ•) ||
/ づ
posted by Elly Vortex at 8:24 AM on August 23, 2018 [27 favorites]
The
To clarify "not supported": everything between the "details" and "summary" tags is entirely visible in IE without any clicking, so please keep that in mind if you're going to use it for spoilers.
posted by Etrigan at 8:24 AM on August 23, 2018 [6 favorites]
tag is not supported by Internet Explorer or Edge, which will impact like one dude or something
To clarify "not supported": everything between the "details" and "summary" tags is entirely visible in IE without any clicking, so please keep that in mind if you're going to use it for spoilers.
posted by Etrigan at 8:24 AM on August 23, 2018 [6 favorites]
It's not the destination, it's the journey.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:25 AM on August 23, 2018
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:25 AM on August 23, 2018
Does this remind anyone else of REVEAL on Teletext? Oh, Digitiser, how I miss you.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:29 AM on August 23, 2018 [5 favorites]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:29 AM on August 23, 2018 [5 favorites]
Knock Knock
Banana
Knock Knock
Banana
Knock Knock
Banana
Knock Knock
Banana
Knock Knock
Orange
Orange you glad I finally got tired of writing this comment?(Seriously though, this is very cool.)
posted by Metroid Baby at 8:34 AM on August 23, 2018 [48 favorites]
A default display option for summary text could be added to MetaFilter's CSS, to avoid text like this which no-one would know contains secret details.
Paul McCartney died in 1966posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:38 AM on August 23, 2018 [5 favorites]
well, was it all worth it?
Needs more interrobang.
posted by Celsius1414 at 8:45 AM on August 23, 2018 [5 favorites]
Needs more interrobang.
posted by Celsius1414 at 8:45 AM on August 23, 2018 [5 favorites]
huzzah! I will add this to my repertoire, along with
posted by the man of twists and turns at 8:56 AM on August 23, 2018 [7 favorites]
code, abbr, sup, sub and .[more inside]
and marqueeeeeeeeeeeeeeeeeeeeeeposted by the man of twists and turns at 8:56 AM on August 23, 2018 [7 favorites]
Don't forget <small><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small>, very useful.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:59 AM on August 23, 2018 [15 favorites]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:59 AM on August 23, 2018 [15 favorites]
If this were to become a MetaFilter default, I would prefer the code that Celsius1414 used:
[div class="comments"][details]The Devil[/details]
-- except the [brackets] are<carrots></carrots>
Without the changing arrow, I feel like I'm in a point-and-click adventure, looking for clues and coins everywhere. The only other indication that there is hidden text is that there's an extra line break before the "posted by" line
posted by filthy light thief at 9:04 AM on August 23, 2018 [4 favorites]
[div class="comments"][details]The Devil[/details]
-- except the [brackets] are
Without the changing arrow, I feel like I'm in a point-and-click adventure, looking for clues and coins everywhere. The only other indication that there is hidden text is that there's an extra line break before the "posted by" line
posted by filthy light thief at 9:04 AM on August 23, 2018 [4 favorites]
I like what TV Tropes does for spoilers; it puts an underscore line where the spoiler is, and it is the correct length of the spoiler.
posted by Melismata at 9:06 AM on August 23, 2018 [7 favorites]
posted by Melismata at 9:06 AM on August 23, 2018 [7 favorites]
▶ Doesn't work for me...
posted by sammyo at 9:53 AM on August 23, 2018 [3 favorites]
posted by sammyo at 9:53 AM on August 23, 2018 [3 favorites]
The one step to an enlightened, contented, life.
Pour the tea into the teacup before introducing the milk. Never, ever, the other way around.posted by Wordshore at 10:04 AM on August 23, 2018 [9 favorites]
I SAY META
YOU SAY FILTER
posted by The Underpants Monster at 10:09 AM on August 23, 2018 [9 favorites]
Without the changing arrow
Also is it a choice people made, or is it something about the arrow that it is just always pointing down if there's no text after it? At any rate,because it was pointing down I thought the OP was just directing me to click into the post, not to click the arrow or text itself.
And then the first comment had an arrow pointing right that said "Details" after it so I thought I was being told to click the "details" tag on the right of the window.
I was a mess figuring out this post, is what I'm saying.
posted by solotoro at 10:29 AM on August 23, 2018 [2 favorites]
Also is it a choice people made, or is it something about the arrow that it is just always pointing down if there's no text after it? At any rate,because it was pointing down I thought the OP was just directing me to click into the post, not to click the arrow or text itself.
And then the first comment had an arrow pointing right that said "Details" after it so I thought I was being told to click the "details" tag on the right of the window.
I was a mess figuring out this post, is what I'm saying.
posted by solotoro at 10:29 AM on August 23, 2018 [2 favorites]
The secret lies forever in the heart of the shipwreck.
posted by Krazor at 10:59 AM on August 23, 2018 [1 favorite]
oh god i've accidentally precipitated an augmented reality game haven't i
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 11:10 AM on August 23, 2018 [9 favorites]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 11:10 AM on August 23, 2018 [9 favorites]
In Firefox, comments that use <details> without <summary> show "Details" plus a disclosure triangle, as expected. But when the comment does have a <summary> tag, there's no disclosure triangle. This means that many of the comments above are incredibly confusing in Firefox, and Krazor's comment is completely unreadable (because it's hidden and Firefox doesn't display anything you can click to make it visible).
This is related to this Firefox bug. It happens on MetaFilter because "normalize.css" which is included in this MetaFilter stylesheet has a summary{display:block;} rule.
This could be fixed on the MetaFilter side by overriding that rule with: summary{display:list-item;}
posted by mbrubeck at 11:38 AM on August 23, 2018 [12 favorites]
This is related to this Firefox bug. It happens on MetaFilter because "normalize.css" which is included in this MetaFilter stylesheet has a summary{display:block;} rule.
This could be fixed on the MetaFilter side by overriding that rule with: summary{display:list-item;}
posted by mbrubeck at 11:38 AM on August 23, 2018 [12 favorites]
Yay, I ruined it! Am I a hacker now?
posted by Krazor at 11:45 AM on August 23, 2018 [10 favorites]
posted by Krazor at 11:45 AM on August 23, 2018 [10 favorites]
Good catch. It saddens me that Firefox bug is two years old :'(
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 11:46 AM on August 23, 2018
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 11:46 AM on August 23, 2018
Actually, it looks like Firefox is compliant with the current HTML spec, and Chrome is not. If Chrome fixes their corresponding bug then it will match the Firefox behavior.
posted by mbrubeck at 12:05 PM on August 23, 2018 [1 favorite]
posted by mbrubeck at 12:05 PM on August 23, 2018 [1 favorite]
East Manitoba Regional Junior Kabaddi Champion '94: "The <details> tag is not supported by Internet Explorer or Edge, which will impact like one dude or something"
I know we're kidding around, but this feels kind of exclusionary?
posted by Chrysostom at 12:30 PM on August 23, 2018 [3 favorites]
I know we're kidding around, but this feels kind of exclusionary?
posted by Chrysostom at 12:30 PM on August 23, 2018 [3 favorites]
I don't know how to get it to say something other than 'Details' by the triangle
posted by meese at 12:53 PM on August 23, 2018
Well that's handy. I've been looking for a way to import an entire Reddit thread into a single MeFi comment.
In my version of FF at least there's no indication that the summary is clickable until it's active, so it might need a touch of CSS sizzle for usability's sake. Some donut sprinkles, perhaps.
posted by XMLicious at 1:20 PM on August 23, 2018 [1 favorite]
It is pitch black. You are likely to be eaten by a grue.
You have died.posted by Barack Spinoza at 1:32 PM on August 23, 2018 [14 favorites]
Shoot an arrow for gds sake. (and chant x..y..zz..why)
posted by sammyo at 1:42 PM on August 23, 2018
posted by sammyo at 1:42 PM on August 23, 2018
Chrysostom: Microsoft is working on adding support to Edge. Not sure why it hasn't happened yet.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 1:49 PM on August 23, 2018 [1 favorite]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 1:49 PM on August 23, 2018 [1 favorite]
This thread reminds me of this amazing xkcd comic. (It doesn't work very well on mobile, though)
posted by acidnova at 1:58 PM on August 23, 2018 [7 favorites]
posted by acidnova at 1:58 PM on August 23, 2018 [7 favorites]
[HISTORY ERASER BUTTON]
... you eeediot!
posted by Barack Spinoza at 3:06 PM on August 23, 2018 [3 favorites]
Is there a way to nest multiple options on a single tier?
Because I want there to be a metafilter Choose Your Own Adventure gameturn to page 42
You have died of dysenteryposted by acidnova at 3:55 PM on August 23, 2018 [15 favorites]
Shows what you know. I was already dead!
posted by It's Raining Florence Henderson at 4:57 PM on August 23, 2018 [5 favorites]
posted by It's Raining Florence Henderson at 4:57 PM on August 23, 2018 [5 favorites]
Is there a way to get the 'hand' pointer or other 'click here' signal to show when you hover over the triangle?
'cuz it took me a good 5 minutes to figure out the triangles were clickable...
[or is that just me?]
posted by calgirl at 4:58 PM on August 23, 2018
'cuz it took me a good 5 minutes to figure out the triangles were clickable...
[or is that just me?]
posted by calgirl at 4:58 PM on August 23, 2018
Is there a way to nest multiple options on a single tier?
Yep! You can put as many sets of <detail> tags as you want inside one another, although obviously loops aren't really feasible. For maximum readability in the end product you'll want to avoid a lot of linebreaks in the HTML. I recommend writing and testing it in a code editor like JSFiddle (like so), then condensing all of the whitespace, then posting. Blockquotes can be used to nest a series of choices. As a demonstration, I present:
Welcome to Choose Your Own MetaFilter Adventure!
posted by jedicus at 9:26 PM on August 23, 2018 [59 favorites]
Yep! You can put as many sets of <detail> tags as you want inside one another, although obviously loops aren't really feasible. For maximum readability in the end product you'll want to avoid a lot of linebreaks in the HTML. I recommend writing and testing it in a code editor like JSFiddle (like so), then condensing all of the whitespace, then posting. Blockquotes can be used to nest a series of choices. As a demonstration, I present:
Welcome to Choose Your Own MetaFilter Adventure!
Make a post!
What kind of post?I found this cool band!
Your favorite band...is actually awesome! Great post!A video game!
What kind of video game?A Choose Your Own Adventure!
Welcome to Choose Your Own MetaFilter Adventure!Okay this is getting a bit too meta
Ba-dum tsh!Less a video game and more an intriguing meditation on how the medium is simultaneously shaping and reflecting the best and worst of our culture.
You are Fizz and I claim my five pounds.
Ask a question!
What kind of question?Should I eat it?
You get conflicting answers. Do you eat it?Throw caution to the wind!
You have died of dysentery.Better play it safe.
You missed out! Sitting under a bed for a few days really gives seafood lasagna a chance to ripen.
What was that short story called?
All Summer in a DayThanks!
You're welcome!
Take it to MeTa!
You are already here.Take it to MeMail!
Thanks, I love fan mail!
posted by jedicus at 9:26 PM on August 23, 2018 [59 favorites]
What was that short story called?
All Summer in a Day
SOMETIMES they are talking about "There Will Come Soft Rains."
posted by Chrysostom at 10:00 PM on August 23, 2018 [7 favorites]
All Summer in a Day
SOMETIMES they are talking about "There Will Come Soft Rains."
posted by Chrysostom at 10:00 PM on August 23, 2018 [7 favorites]
▶ Doesn't work for me either, but then my OS/brower/life are all deprecated.
Spoilers never bother me tho so all is well.
posted by a humble nudibranch at 10:28 PM on August 23, 2018
Spoilers never bother me tho so all is well.
posted by a humble nudibranch at 10:28 PM on August 23, 2018
Jedicus, I can't thank you enough for that delightful example.
posted by acidnova at 11:49 PM on August 23, 2018 [2 favorites]
posted by acidnova at 11:49 PM on August 23, 2018 [2 favorites]
Not “chicken butt”? Awwwww. :7(
posted by wenestvedt at 3:46 AM on August 24, 2018 [5 favorites]
posted by wenestvedt at 3:46 AM on August 24, 2018 [5 favorites]
I can't see blink or marquee in Chrome or Firefox, and I really miss them!
posted by jgirl at 4:24 AM on August 24, 2018 [1 favorite]
posted by jgirl at 4:24 AM on August 24, 2018 [1 favorite]
What's a details tag?
$20, SAITposted by cynical pinnacle at 4:40 AM on August 24, 2018 [9 favorites]
I spent far too long thinking, "This doesn't work for me", because the cursor didn't go all pointy-finger. There was no indication that anything was clickable, so I didn't until I did. I mean, yeah, ok, cool, but I can see this getting sort of inside-jokey, and kind of cliquey (pun ... noted.)
posted by quinndexter at 5:08 AM on August 24, 2018 [1 favorite]
[more inside]
Firefox 61.0.2 on Win 10 64bit, uBlock Origin enabled. In case you were asking. Which you weren't.posted by quinndexter at 5:08 AM on August 24, 2018 [1 favorite]
The truth is...
...I don't know what I'm doing.posted by arcticseal at 5:29 AM on August 24, 2018 [1 favorite]
Blink and Marquee were never incorporated into HTML standards because they're not good for accessibility. It's actually required in the standards for browsers to allow Blink to be disabled, and Firefox has met that requirement by never enabling it.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 6:21 AM on August 24, 2018 [2 favorites]
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 6:21 AM on August 24, 2018 [2 favorites]
I love this. Thank you.
posted by hurdy gurdy girl at 11:49 AM on August 24, 2018 [1 favorite]
posted by hurdy gurdy girl at 11:49 AM on August 24, 2018 [1 favorite]
Testing
Check. Check. Testing. One. Two. Can everyone hear me?posted by carmicha at 8:47 PM on August 24, 2018 [1 favorite]
Talking of which, how well does it do in screenreaders, Which were always the sticking point for those?
posted by Artw at 11:15 AM on August 25, 2018 [1 favorite]
posted by Artw at 11:15 AM on August 25, 2018 [1 favorite]
Well isn’t that
something.Sorry, no great jokes. Just wrapping my head around the syntax.
posted by Devils Rancher at 6:32 PM on August 25, 2018 [1 favorite]
This means that many of the comments above are incredibly confusing in Firefox, and Krazor's comment is completely unreadable (because it's hidden and Firefox doesn't display anything you can click to make it visible).
It seems to work for me using Firefox 61.0.2 (Mac)
posted by Thorzdad at 6:25 AM on August 26, 2018
It seems to work for me using Firefox 61.0.2 (Mac)
Unless there's more to Krazor's comment other than what's revealed after clicking the arrow...
posted by Thorzdad at 6:25 AM on August 26, 2018
Unless codebreakers want to solve the puzzle and win absolutely nothing except my respect, then yes, you're seeing everything.
posted by Krazor at 6:50 AM on August 27, 2018
posted by Krazor at 6:50 AM on August 27, 2018
a little trick for converting celcius to fahrenheit
double the Centigrade temp, subtract the first digit of the result from the result and add 32. It works pretty well; you’re usually right on but you’ll never be more than 1 degree Fahrenheit off.https://www.fodors.com/community/africa-and-the-middle-east/a-little-trick-for-converting-centigrade-to-fahrenheit-813970/
For example, 23 C equals 74 F.
23 C x 2 = 46;
46 – 4 = 42;
42 + 32 = 74 F
posted by aniola at 2:27 PM on August 28, 2018 [3 favorites]
It works in Firefox if you're using MetaFilter's "Classic" theme. The buggy CSS is only in the "Modern" theme.
posted by mbrubeck at 2:36 PM on August 28, 2018
posted by mbrubeck at 2:36 PM on August 28, 2018
I'm pretty sure converting Celsius to Fahrenheit works under all Metafilter themes.
posted by Chrysostom at 3:38 PM on August 28, 2018 [2 favorites]
posted by Chrysostom at 3:38 PM on August 28, 2018 [2 favorites]
I'm pretty sure converting Celsius to Fahrenheit works under all Metafilter themes.
/throws metric gang signs using all my digits
#centigrade4lyfe
posted by Celsius1414 at 5:50 PM on August 28, 2018 [1 favorite]
/throws metric gang signs using all my digits
#centigrade4lyfe
posted by Celsius1414 at 5:50 PM on August 28, 2018 [1 favorite]
The real hipsters use Rankine.
posted by Chrysostom at 6:45 PM on August 28, 2018
posted by Chrysostom at 6:45 PM on August 28, 2018
Talk Fahrenheit, talk Centigrade.
Use language we can comprehend.posted by The Underpants Monster at 7:03 PM on August 28, 2018
▶ All the reasons to vote #1 quidnunc kid!
posted by the quidnunc kid at 9:34 AM on August 29, 2018 [6 favorites]
posted by the quidnunc kid at 9:34 AM on August 29, 2018 [6 favorites]
does anyone read the comments down here?
posted by the quidnunc kid at 2:46 AM on August 30, 2018 [4 favorites]
P.S.
For anyone playing along at home, the first letter in the second one is a typo.posted by Krazor at 8:58 AM on August 30, 2018
O
be
kind
to
your
web
footed
friends,
for
a
duck
may
be
somebody's
mother.
She
goes
every
day
to
the
swamp,
where
the
weather
is
cold
and
domp
(to rhyme with "swamp").
Now
you
may
think
that
this
is
the
end:
Well
it
▸ isposted by flabdablet at 7:00 AM on September 3, 2018 [2 favorites]
Turtles
Turtles
Turtles
Turtles
Turtles
Turtles
Turtles
Turtlesposted by Kabanos at 7:21 AM on September 6, 2018 [5 favorites]
You are not logged in, either login or create an account to post comments
posted by Celsius1414 at 8:01 AM on August 23, 2018 [69 favorites]