Re: [css3-selectors]: Proposal: :in-view() selector for better visibility control

Oriol, you are absolutely right. :)

We can solve the issue just by one rule. Only first rule is affected. Other
will be ignored.



On Wed, Nov 30, 2016 at 10:11 PM, Oriol _ <oriol-bugzilla@hotmail.com>
wrote:

> I said the following code would be an infinite loop because if an element
> is in view, then the selector selects it and hides it.
> So presumably it becomes out of view, then the selector no longer applies,
> and the element becomes in view again.
> And so on.
>
> ```css
> :in-view(all) {
>   display: none;
> }
> ```
>
> If `display: none` for some reason is not considered to make the element
> become out of view, then consider something like
>
> ```css
> :in-view(all) {
>   position: fixed;
>   right: -1000000000000px
> }
> ```
>
> - Oriol
>
>
>
>
> ------------------------------
>
> How could it be infinite loop?
> Elements would just disappear at the moment they will fit in to viewport.
> I have another question:
> May we say that element with visibility:hidden actually IS inside
> viewport? It have size, so…
> And what about display:none? Such elements don't have size, but I think
> they have a position…
>
>
>
> *Anton Nemtsev*
> Frontend Developer
> +38 050 277 38 82 <+380502773882>
> anton.nemtsev@vaimo.com
> [image: Vaimo Logo] <http://www.vaimo.com/> *Vaimo*
> Zhylianska str. 31
> Kiev, Ukraine
> +38 044 364 19 66 <+380443641966> | www.vaimo.com
>
> *We are hiring* - Help us grow!
> vaimo.com/careers <http://www.vaimo.com/careers/>
>
> *Follow us:* [image: Vaimo Facebook] <http://www.facebook.com/VaimoGlobal>
>  [image: Vaimo Twitter] <https://twitter.com/vaimoglobal> [image: Vaimo
> LinkedIn] <http://www.linkedin.com/company/2510355>
>
> On 30 November 2016 at 21:42, Oriol _ <oriol-bugzilla@hotmail.com> wrote:
>
>> I think this could produce infinite loops:
>>
>>
>> ```css
>>
>> :in-view(all) {
>>
>>   display: none;
>>
>> }
>>
>> ```
>>
>> - Oriol
>>
>>
>> ------------------------------
>>
>> Hi folks!
>>
>> It would be perfect if we get the next pseudo class: :in-view() with a
>> different parameters
>> :in-view(all) - selected node is 100% visible in viewport
>> :in-view(partial) - selected node is partially visible in viewport
>> :in-view(none) - selected node is outside of viewport
>>
>> And inverted logic using :not()
>> :not(:in-view(all)) - synonym of :in-view(none)
>> :not(:in-view(partial)) - selected node is partially INvisible in viewport
>> :not(:in-view(none)) - synonym of :in-view(all)
>>
>> Real cases are the next.
>> If I have some absolutely positioned popup blocks inside of relative
>> positioned ones, sometimes it fall out from viewport due relative block
>> position I would like to return that block into a viewport again. Now I
>> have to use JS.
>>
>> Other one is sticky behavior. I can hide something or change the position
>> just using :in-view(partial) selector. I don't need position: sticky
>> anymore :)
>>
>> So, what do you think about it?
>>
>> --
>> s0rr0w
>>
>
>


-- 
s0rr0w