HTML has plenty of practical secrets that might come in handy.
But I do want to make sure that the site is working on Internet Explorer and other ...
For further actions, you may consider blocking this person and/or reporting abuse
<3 <3 <3
I LOVE the datalist tag and appreciate anyone who helps evangelize it! It can also be combined with
autocomplete='off'
on the element that its used with so that you don't get annoying values in there. For instance if you have a list of employees and the type of the input is set to email, you wouldn't want all of your emails that you use to be autocompleted.Also you can add stuff into option for better autocomplete.
with this searching names, or email will work. Even partials like 'ty@examp' will work and only bring up Arty.
The above example can be seen in this fiddle: jsfiddle.net/t2qb90vu/
Thanks! I was just in a desperate need for this kind of searchable list! :)
Glad to help! :D
That's amazing.
Thank you for sharing this with us.
No problem! I'm a real big fan of not using JS or adding custom logic where you can get away with it. As a result I'm a HUGE fan of the datalist tag for autocomplete and also the
details
tag for most accordions. Especially on smaller sites.Glad I that you and others find this useful. :)
dev.to actually uses the details tag for its accordion to close comment threads! The little arrow on the left of comments is via the details tag. You can see it via inspect element! :D
Man, last time I've used
<map>
was, like, last century... 😂Pretty much abandoned and with a weird interface, it's still completely supported. It was actually pretty advanced at that time.
The map tag I have seen before in legacy websites. Where the Devs where lazy and put an image of an menu in the headers. And made it clickable using a map. And people needed to shuffle some items around... In the image...
Such a classic example of a good concept used in wrong way.
Thank you for sharing that.
Wow, I had no idea that there was a native HTML typeahead-like control. Thanks!
Glad you liked it.
Figure with img could use some srcsets.
Superb. 👏
Love the datalist tag.
Love the idea of Input Suggestions — I didn't know about that one!
How's accessibility with the image map? Hopefully with the outline, alts and link titles it is fine.
thank you for sharing tricks :)
No.7 was awesome :D, thanks bro
Wow, there is some great stuff in this, thanks for sharing!
Image maps? Like in 1998? Next we'll slice them up in tables ;)
Otherwise there is some good stuff here
contenteditable... had no idea!! Thanks for this Klaus, great read 🤜👍
I just simply say wowww and thank you for such an amazing post. 🙏🙏🙏🙏
This list was awesome thank you! Will be very helpful for me to use and refer to!