Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.infosystems.www.authoring.stylesheets > #7841

Re: Buttons glowing on being selected

From Thomas 'PointedEars' Lahn <PointedEars@web.de>
Newsgroups comp.infosystems.www.authoring.stylesheets, comp.lang.javascript
Subject Re: Buttons glowing on being selected
Followup-To comp.infosystems.www.authoring.stylesheets
Date 2017-12-20 01:29 +0100
Organization PointedEars Software (PES)
Message-ID <2306836.4kSItuVXeT@PointedEars.de> (permalink)
References <e5c8e291-3051-4e66-a51c-83c853241976@googlegroups.com> <87zi6gx8nt.fsf@bsb.me.uk> <240a60f2-954f-439e-9fbe-73826174085b@googlegroups.com> <87zi6eguk0.fsf@bsb.me.uk>

Cross-posted to 2 groups.

Followups directed to: comp.infosystems.www.authoring.stylesheets

Show all headers | View raw


[X-Post & F’up2 comp.infosystems.www.authoring.stylesheets]

Ben Bacarisse wrote:

> bit-naughty@hotmail.com writes:
>> Ben Bacarisse wrote:
>>> You don't need client-side scripting for this.  Here is a very simple
>>> example using CSS:
>>> 
>>>   http://bsb.me.uk/testing/button.html
>>> 
>>> and another where you can see it in action with a submit button:
>>> 
>>>   http://bsb.me.uk/testing/button.php
>>> 
>>> The idea is that you style the label of a checkbox.  I've chosen to 
>>> hide the checkbox, but you don't have to do that.
>>> 
>>> You can view the PHP source at http://bsb.me.uk/testing/button-php.txt
>>
>> Ben, for the 1st URL - what's the "label input { display: none; }"
>> line for?
> 
> It hides the input checkbox.

You should use

  visibility: hidden; /* or opacity: 0 */
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;

instead; otherwise the checkbox may not be selectable, and accessibility 
keys may not work, as “display: none” tells the UA to not render the 
element.  For some mobile browsers we had to use other tricks, too, but
I do not remember exactly what they were (only “position” comes to mind).

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | <http://PointedEars.de/es-matrix>
<https://github.com/PointedEars> | <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.

Back to comp.infosystems.www.authoring.stylesheets | Previous | Next | Find similar | Unroll thread


Thread

Re: Buttons glowing on being selected Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-12-20 01:29 +0100

csiph-web