Re: Issue 62660 in chromium: CSS transitions get applied upon page load when @media queries are present

8 views
Skip to first unread message

chro...@googlecode.com

unread,
Jan 10, 2011, 4:40:17 AM1/10/11
to chromi...@chromium.org

Comment #1 on issue 62660 by benjamindc: CSS transitions get applied upon
page load when @media queries are present
http://code.google.com/p/chromium/issues/detail?id=62660

Here’s a more minimal test case of the bug:
http://playground.deaxon.com/css/animated-responsive-layout

chro...@googlecode.com

unread,
Jun 16, 2011, 3:00:46 AM6/16/11
to chromi...@chromium.org
Updates:
Status: Available
Labels: -Area-Undefined Area-WebKit WebKit-CSS

Comment #2 on issue 62660 by k...@chromium.org: CSS transitions get applied

upon page load when @media queries are present
http://code.google.com/p/chromium/issues/detail?id=62660

Confirmed that http://playground.deaxon.com/css/animated-responsive-layout
performs the transition on load when the window is thin enough on
13.0.767.1 dev.

chro...@googlecode.com

unread,
Oct 21, 2011, 8:42:03 AM10/21/11
to chromi...@chromium.org

Comment #4 on issue 62660 by eva...@gmail.com: CSS transitions get applied
upon page load when @media queries are present
http://code.google.com/p/chromium/issues/detail?id=62660

I'm also seeing this issue when I don't have media queries.

I have a block that slides to the right on hover, but on page load it
transitions to the left and up into it's initial position. I'm only seeing
this on chrome.

css:

#resources ul {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* ie8 */
filter: alpha(opacity=0); /* ie5-7 */
opacity: 0; /* real browsers */
left: 20px;
width: 240px;
height: 250px;
position: relative;
margin-top: -250px;
z-index: 99;
-webkit-transition: all .3s ease-in-out .3s;
-moz-transition: all .3s ease-in-out .3s;
-o-transition: all .3s ease-in-out .3s;
transition: all .3s ease-in-out .3s;
background-color: rgb(226,117,52);
}
#resources:hover ul {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* ie8
*/
filter: alpha(opacity=90); /* ie5-7 */
opacity: 0.9; /* real browsers */
left: 279px;
top: 0;
}

adding the display:none/block to the css resolves the issue, but then the
transition does not work.

chro...@googlecode.com

unread,
Mar 24, 2015, 8:32:08 AM3/24/15
to chromi...@chromium.org

Comment #8 on issue 62660 by tim...@chromium.org: CSS transitions get
applied upon page load when @media queries are present
https://code.google.com/p/chromium/issues/detail?id=62660

Are people still seeing this issue? I tried the test in comment #1 and
can't repro this (mac / M41).

--
You received this message because this project is configured to send all
issue notifications to this address.
You may adjust your notification preferences at:
https://code.google.com/hosting/settings
Reply all
Reply to author
Forward
0 new messages