I thought that when javascript was disabled that Show/More or less wouldn't toggle since that requires Javascript but at least the hidden text would become visible. This doesn't appear to be the case. How can I make it so it is? Do I need to use a Noscript rule and if so on what? Thanks.
Show More Or Less visibilty when no Javascript
(5 posts) (3 voices)-
Posted 5 years ago
-
Bump! I still want to know how to show the content of Show More or Less when Javascript is disabled. I also want to know how to centre the show more or less trigger within a parent div and have the text block that is revealed aligned-left. How to do that, thanks.
Posted 5 years ago -
We don't have a noscript rule for SML. We can easily add one on the next update if that would be helpful. It might help to consider that until we do this not a serious issue. It is fully accessible at all times for assistive readers. The number of sighted people running devices with script disabled is statistically irrelevant. That said, we will put a noscript rule in our schedule for the next update.
Centering? Set the trigger element to text-align center.
Posted 5 years ago -
Thanks, for your reply, a noscript rule for SML would be great. Regarding Centering I see didn't explain fully. I have a div and inside that div I want the trigger to be centered horizontally but I want the actual text that is displayed when triggered to be aligned left but centered within the parent div. I guess I need an inline-block or margin auto but I can't figure it out.
Posted 5 years ago -
You could try this, set your sml to indented and put this at the bottom of the sml stylesheet.....
/*center the trigger*/
a.sml-more {
display: block !important;
text-align:center !important;
border:none !important;
}/*center the sml div */
.sml-content.indented {
width: 75%; /*new value - change to suit*/
border-right: 1px dotted; /*added - optional*/
padding-right: 1em; /*added - optional*/
}
@media only screen and (min-width: 0px) and (max-width: 700px) {
.sml-content.indented {
width: auto;
border:none;
padding: 0;
}
}HTH
Posted 5 years ago
Reply
You must log in to post.