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.

posted by East Manitoba Regional Junior Kabaddi Champion '94 to MetaFilter-Related at 7:58 AM (80 comments total) 52 users marked this as a favorite

The Devil

posted by Celsius1414 at 8:01 AM on August 23, 2018 [71 favorites]


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 [20 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

[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]


How it do on Mobile?
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]


<details> works fine on mobile.
posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:14 AM on August 23, 2018


 ?▼
  !▼   well, was it all worth it?

posted by scruss at 8:23 AM on August 23, 2018 [29 favorites]




| ̄ ̄ ̄ ̄ ̄ ̄ |
| METAFILTER |
| IS |
| AWESOME! |
| _______|
(\__/) ||
(•ㅅ•) ||
/   づ


posted by Elly Vortex at 8:24 AM on August 23, 2018 [28 favorites]


The
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 [7 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


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]


Knock Knock
Banana
Knock Knock
Banana
Knock Knock
Banana
Knock Knock
Banana
Knock Knock
OrangeOrange 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 [50 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 1966

posted by East Manitoba Regional Junior Kabaddi Champion '94 at 8:38 AM on August 23, 2018 [5 favorites]


Fact:Pee is stored in the balls.

posted by bondcliff at 8:41 AM on August 23, 2018 [11 favorites]


well, was it all worth it?

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 code, abbr, sup, sub and blink.

[more inside]and marqueeeeeeeeeeeeeeeeeeeeee

posted 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 [16 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]


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 [8 favorites]


Detailsmagazine

posted by maxsparber at 9:47 AM on August 23, 2018 [3 favorites]


▶ Doesn't work for me...
posted by sammyo at 9:53 AM on August 23, 2018 [3 favorites]


lolbutts

posted by poffin boffin at 9:57 AM on August 23, 2018 [25 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]


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]


Idk, did you?.

posted by Krazor at 11:27 AM on August 23, 2018 [2 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 [13 favorites]


Yay, I ruined it! Am I a hacker now?
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


Man Hates Particle Man

posted by rodlymight at 11:54 AM on August 23, 2018 [17 favorites]


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]


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 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 [1 favorite]


Well that's handy. I've been looking for a way to import an entire Reddit thread into a single MeFi comment.
⸻⸽⸻⸽⸻⸽⸻⸽⸻
Why even link to things any more? Just embed the entire website! Or the whole book!

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


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]


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 [8 favorites]


Press
to pay respects

posted by tobascodagama at 2:38 PM on August 23, 2018 [1 favorite]


[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 game
turn to page 42You have died of dysentery

posted 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]


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


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!
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 Day
Thanks! 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]


▶ 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


Jedicus, I can't thank you enough for that delightful example.
posted by acidnova at 11:49 PM on August 23, 2018 [2 favorites]


Hey guess what
You just lost the game

posted by duffell at 12:10 AM on August 24, 2018 [1 favorite]


Not “chicken butt”? Awwwww. :7(
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]


What's a details tag?$20, SAIT

posted by cynical pinnacle at 4:40 AM on August 24, 2018 [10 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.)

[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]


Oh, I could envision so many ways to "abuse" this... I shall strive not/perhaps-not to abuse this over the next decade.

I hope most of my uses of it are actually useful *drinks Hyde potion*
posted by hippybear at 5:34 AM on August 24, 2018


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]


I love this. Thank you.
posted by hurdy gurdy girl at 11:49 AM on August 24, 2018 [1 favorite]


TestingCheck. Check. Testing. One. Two. Can everyone hear me?

posted by carmicha at 8:47 PM on August 24, 2018 [1 favorite]


Welp bye bye to ABBR and Rot13 I guess.
posted by Artw at 11:13 AM on August 25, 2018


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]


Well isn’t thatsomething.


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)
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


Rock & Roll, cola warsI can't take it anymore

posted by grumpybear69 at 1:26 PM on August 28, 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.

For example, 23 C equals 74 F.
23 C x 2 = 46;
46 – 4 = 42;
42 + 32 = 74 F
https://www.fodors.com/community/africa-and-the-middle-east/a-little-trick-for-converting-centigrade-to-fahrenheit-813970/

posted by aniola at 2:27 PM on August 28, 2018 [4 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


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]


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]


The real hipsters use Rankine.
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]


 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 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


WESteven Universe song

posted by Artw at 9:00 AM on August 30, 2018 [1 favorite]


 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 Yes.

posted by flabdablet at 9:55 PM on September 2, 2018 [1 favorite]


 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 ▸     

posted by flabdablet at 6:40 AM on September 3, 2018 [1 favorite]


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 ▸ is

posted by flabdablet at 7:00 AM on September 3, 2018 [2 favorites]


Turtles
Turtles
Turtles
Turtles
Turtles
Turtles
TurtlesTurtles

posted by Kabanos at 7:21 AM on September 6, 2018 [5 favorites]


« Older new york times   |   Mefi Cookbook available! Newer »

You are not logged in, either login or create an account to post comments