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


Groups > comp.lang.javascript > #34412

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.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread


Thread

Buttons glowing on being selected bit-naughty@hotmail.com - 2017-12-15 04:25 -0800
  Re: Buttons glowing on being selected "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2017-12-15 18:13 +0100
  Re: Buttons glowing on being selected Philip Herlihy <thiswillbounceback@you.com> - 2017-12-18 12:27 +0000
  Re: Buttons glowing on being selected Ben Bacarisse <ben.usenet@bsb.me.uk> - 2017-12-18 17:12 +0000
    Re: Buttons glowing on being selected bit-naughty@hotmail.com - 2017-12-19 12:03 -0800
      Re: Buttons glowing on being selected Ben Bacarisse <ben.usenet@bsb.me.uk> - 2017-12-19 23:35 +0000
        Re: Buttons glowing on being selected Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2017-12-20 01:29 +0100
  Re: Buttons glowing on being selected bit-naughty@hotmail.com - 2017-12-19 11:52 -0800
    Re: Buttons glowing on being selected John G Harris <niam@jghnorth.org.uk.invalid> - 2017-12-19 20:14 +0000
      Re: Buttons glowing on being selected "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2017-12-19 21:17 +0100
    Re: Buttons glowing on being selected Julio Di Egidio <julio@diegidio.name> - 2017-12-21 11:10 -0800

csiph-web