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


Groups > comp.lang.javascript > #36611

Re: TWO lines of code for transforms?

Newsgroups comp.lang.javascript
Subject Re: TWO lines of code for transforms?
From "Evertjan." <exxjxw.hannivoort@inter.nl.net>
References (2 earlier) <a6aa0673-cce7-47c7-a97a-635cd0c22fbc@googlegroups.com> <877eauo7g0.fsf@bsb.me.uk> <ef5f0cce-7f0a-4efb-9367-1848456865b1@googlegroups.com> <87v9yemiv7.fsf@bsb.me.uk> <bffd7eca-b054-46ab-9ea6-81403cddb8b2@googlegroups.com>
Date 2019-05-15 09:43 +0200
Message-ID <XnsAA5062FC1B4CBeejj99@194.109.6.166> (permalink)

Show all headers | View raw


groovee@cyberdude.com wrote on 15 May 2019 in comp.lang.javascript:

> On Monday, 13 May 2019 21:45:00 UTC+5:30, Ben Bacarisse  wrote:
>> 
>> You probably need to see some more examples to reset the view you've
>> formed of how this stuff works.  Here's one that uses a margin:
>> 
>> <!DOCTYPE html>
>> <head>
>>     <style>
>>      p { margin-left: 10em; transition: margin-left 2s; }
>>      p:hover { margin-left: 1em; }
>>     </style>
>> </head>
>> <body>
>>     <p>This is paragrah with a wide margin.</p>
>> </body>
>> 
> 
> OK, so the first "p" line means that "if there are any changes to the
> margin-left property, that change will take 2s to complete" - is that
> it? 
> 
> Btw, I notice that if you put the "p:hover" line BEFORE the first "p"
> line, it still works!! - how the hell is THAT? How does that work?? 

This is NOT a *script code* that is executed, 
it is a *CSS style declaration*.

[That's why it is OFF-TOPIC in this NG.]

In *CSS style declarations* ORDER is only significant where they:

1 conflict
and 
2 have the same specificity
> Also - there's no "transform" anywhere at all in the above code...?!!
> Isn't that compulsory? (I'm getting Confused a little more...) 

READING the specs would help you:

"The **transform** property applies a 2D or 3D transformation to an element. 
This property allows you to rotate, scale, move, skew, etc., elements."

So "transforming an element" is NOT "manipulating a margin".

"CSS **transitions** allows you to change property values smoothly (from one 
value to another), over a given duration."


-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread


Thread

TWO lines of code for transforms? groovee@cyberdude.com - 2019-05-10 03:52 -0700
  Re: TWO lines of code for transforms? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2019-05-10 13:38 +0200
  Re: TWO lines of code for transforms? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2019-05-10 14:27 +0200
    Re: TWO lines of code for transforms? "Mark-" <nospam@mapson.xyz> - 2019-05-10 14:13 +0000
      Re: TWO lines of code for transforms? John G Harris <niam@jghnorth.org.uk.invalid> - 2019-05-11 11:26 +0100
        Re: TWO lines of code for transforms? Julio Di Egidio <julio@diegidio.name> - 2019-05-11 04:20 -0700
          Re: TWO lines of code for transforms? Ben Bacarisse <ben.usenet@bsb.me.uk> - 2019-05-11 14:31 +0100
            Re: TWO lines of code for transforms? Julio Di Egidio <julio@diegidio.name> - 2019-05-11 08:29 -0700
              Re: TWO lines of code for transforms? Ben Bacarisse <ben.usenet@bsb.me.uk> - 2019-05-11 16:59 +0100
                Re: TWO lines of code for transforms? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2019-05-11 17:55 +0200
              Re: TWO lines of code for transforms? John G Harris <niam@jghnorth.org.uk.invalid> - 2019-05-11 18:31 +0100
                Re: TWO lines of code for transforms? Gene Wirchenko <genew@telus.net> - 2019-05-11 22:01 -0700
          Re: TWO lines of code for transforms? John G Harris <niam@jghnorth.org.uk.invalid> - 2019-05-11 18:18 +0100
            Re: TWO lines of code for transforms? Gene Wirchenko <genew@telus.net> - 2019-05-11 22:04 -0700
              Re: TWO lines of code for transforms? John G Harris <niam@jghnorth.org.uk.invalid> - 2019-05-12 10:27 +0100
                Re: TWO lines of code for transforms? Gene Wirchenko <genew@telus.net> - 2019-05-14 10:44 -0700
  Re: TWO lines of code for transforms? Ram Tobolski <ramtob@gmail.com> - 2019-05-11 07:06 -0700
    Re: TWO lines of code for transforms? groovee@cyberdude.com - 2019-05-13 04:28 -0700
      Re: TWO lines of code for transforms? Ben Bacarisse <ben.usenet@bsb.me.uk> - 2019-05-13 13:38 +0100
        Re: TWO lines of code for transforms? groovee@cyberdude.com - 2019-05-13 07:31 -0700
          Re: TWO lines of code for transforms? Ram Tobolski <ramtob@gmail.com> - 2019-05-13 09:11 -0700
          Re: TWO lines of code for transforms? Ben Bacarisse <ben.usenet@bsb.me.uk> - 2019-05-13 17:14 +0100
            Re: TWO lines of code for transforms? groovee@cyberdude.com - 2019-05-14 23:56 -0700
              Re: TWO lines of code for transforms? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2019-05-15 09:43 +0200
              Re: TWO lines of code for transforms? Ben Bacarisse <ben.usenet@bsb.me.uk> - 2019-05-15 22:06 +0100

csiph-web