Questions tagged [webkit-transition]

19 questions
11
votes
5 answers

How do I get the -webkit-transition-duration property with jQuery?

Since this sets the transition duration to 1 second: $('#objectID').css('webkit-transition-duration','1s'); I assumed this would return the current duration value: $('#objectID').css('webkit-transition-duration'); but it does not.
narrowdesign
  • 195
  • 1
  • 2
  • 8
5
votes
2 answers

CSS Transforms and Hover Property

SOLVED - the problem is that doing a rotation puts half of the element behind the neutral (zero) Z-axis for the webpage, and WebKit apparently doesn't allow mouse events through that "neutral" plane. So changing the rotation point to the right/left…
jstm88
  • 3,335
  • 4
  • 38
  • 55
3
votes
1 answer

Pulsing dot in CSS Chrome display issue

I'm trying to create a pulsing dot effect with CSS. HTML markup is simple: The CSS is like this: @-webkit-keyframes pulse{ 0%{ opacity:1; width: 16px; height:…
idjuradj
  • 1,355
  • 6
  • 19
  • 31
3
votes
1 answer

transition-FOUC in WebKit?

WebKit just kept annoying me very much: upon page load it would animate a transition from the initial , browser-default, value. I had something like a:link { color: black; -webkit-transition: color 1s; } but it would fade in from color:…
kubi
  • 829
  • 2
  • 14
  • 24
3
votes
1 answer

Problems applying the CSS transition property using javascript and a jQuery .each() loop

In order to create some swooshey menus, I'm trying to set the CSS transition property on
  • elements using jQuery. The HTML looks like this:
  • 3
    votes
    1 answer

    Is there a way you can check if a css transition will take place?

    I put a transition on an object using Javascript: $(this).css('transition', 'all 1000ms'); And I listen to the transition end event: $(this).on('webkitTransitionEnd', function() { alert('Transition did finish.'); }); The event is triggered and…
    Mark
    • 16,906
    • 20
    • 84
    • 117
    2
    votes
    2 answers

    Transition starts too early, while css style hasn't applied completely yet

    My code is here. There are three position:zero(0,0),end(200,200),random(0,200). A div is in the position random(0,200) at the beginning. I want to : step 1) set the div in the position zero(0,0). this step no animation step 2) move it from position…
    hardPass
    • 19,033
    • 19
    • 40
    • 42
    1
    vote
    2 answers

    transition where division expands on hover is not working for the division on the right

    I am trying to make a transition where the division expands once you hover over it, but it is not working for the division on the far right and it just glitches out in a weird way when I hover over it. here's the HTML:
    1
    vote
    1 answer

    How can I reverse the effect of this webkit transition?

    I want the content div to go from blurry to sharp, but i can only figure out how to do the opposite thing. div { -webkit-filter: blur(5px); -moz-filter: blur(5px); -o-filter: blur(5px); -ms-filter: blur(5px); filter: blur(5px); …
    ivan
    • 11
    • 1
    1
    vote
    0 answers

    webkit-transition animation not working on iphone and ipad

    here the my css .hover-box { position: absolute; top: 0; left: 4%; width: 92%; height: 100%; border-radius: 5px; background: #72b842; visibility: hidden\0/; opacity: 0\0/; transition: all 0.25s…
    xero
    • 11
    • 3
    0
    votes
    1 answer

    Different durations for different properties using WebKit transitions/animation

    I'm using WebKit transition to animate certain CSS changes. For example, say I've got a red box that I want to change to green when someone hovers. I use this: -webkit-transition-duration: 200ms; -webkit-transition-property:…
    Nathan
    • 6,772
    • 11
    • 38
    • 55
    0
    votes
    1 answer

    Problem with CSS transitions on a tags in Safari

    I'm having trouble with a -webkit-transition effect in a HTML page. The page is here: http://www.newerawrestling.co.uk/new/ Basically, the colour of the links within the main sections (marked up in a
    tag respectively) seem to be broken.…
    Martin Bean
    • 38,379
    • 25
    • 128
    • 201
    0
    votes
    1 answer

    CSS Transform/Transition not working on Safari

    The following CSS works to animate a couple of listed items I have on this page: https://startup.buscoajack.com/homepage-aurelie/ selector { display: flex; } #primary li a { -webkit-background-clip: text; -webkit-text-fill-color:…
    0
    votes
    2 answers

    Why doesn't `style.webKitTransition` and `style.webkitTransform` work anymore in Chrome?

    These lines: numberElement.style.webkitTransition=".1s ease-in-out"; numberElement.style.webkitTransform="scale(2.0)"; 100% worked no more than a year ago. I pulled down the very stale repo to add another feature to it, but when I viewed the page,…
    A O
    • 5,516
    • 3
    • 33
    • 68
    0
    votes
    3 answers

    -webkit-transition: property isn't working in a bubble element?

    I was creating a portfolio, and I want it so that whenever someone hovers over my name, a bubble with an arrow appears. I've done that part already, but the problem is that the -webkit-transition property isn't working. The bubble is a little far to…
    1
    2