Rich-Harris / ramjet

Morph DOM elements from one state to another with smooth animations and transitions

Home Page:http://www.rich-harris.co.uk/ramjet/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Images gets transparent on transition start

gregorvoinov opened this issue · comments

Hi,

I'm using vue-overdrive, but under the hood it uses your ramjet. So maybe you can help me ;)

I have done a screencast to demonstrate the problem. As you can see in the video, if I click an image it fades everything out and then beginns to fade in the image again. I have done also a small sandbox example

In vue-overdrive the ramjet magic happens there

  ramjet.hide(clone)
  ramjet.hide(this.$el.firstChild)
  ramjet.transform(clone, this.$el.firstChild, opts)

I have allready tried out to set the opacity manually

this.$el.firstChild.style.opacity = 1
clone.opacity = 1

This is the whole file

I've seen that on the elements the style opacity: 1 is set, but I do not put this by myself, maybe it has something to do with that behavior?
image

I have updated ramjet from 0.5.0 to 0.6.0-alpha, because I have seen that there are some updates about opacity.

Do you think that's more a vuejs/vue-overdrive problem or more related to ramjet?

@gregorvoinov I think I've identified a fix for this issue, and I'm fairly certain it's related to overdrive, not Ramjet. Stay tuned for more details.