›

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Sign In Register

Categories

Dissolve transition on all scene-changes (Harlowe-specific?)

joebaxterwebbjoebaxterwebb
in Help! with 2.0
Hi,

I'm trying to make my Twine so that every transition is a dissolve. There are a lot of pages that have a similar header/footer and only the text in the centre changes, so I was thinking if I could get the pages to cross-fade, it would give the illusion that the header/footer text was remaining there while the central body of text faded in and out. I've cobbled together the following but the out animation seems to just be cut-short by the in rather than creating the type of crossfade I would normally associate with a "dissolve". Anyone know what I need for a pure "dissolve" effect between two scenes?


.transition-out[data-t8n^=dissolve] {
-webkit-animation:disappear 4000ms;
animation:disappear 4000ms
}

.transition-in[data-t8n^=dissolve] {
-webkit-animation:appear 2000ms;
animation:appear 2000ms

Comments

  • SageSage
    I don't have a good handle on CSS, but I can maybe offer you another way to accomplish it.

    How about this:

    (From @L )
    More importantly, though, is that you can declare a "header" or "footer" for every passage by using the tag 'header' or 'footer'. These can contain displayed text (like a special HUD, etc.) but more likely it will be used to hold prerender/postrender code, such as (replace:) macros that can selectively alter the text of every passage in the story.
  • joebaxterwebbjoebaxterwebb
    Hmm. I'm not sure if this will accomplish what I'm looking for. Just a straight dissolve on every transition, as in this Sugarcube example: http://www.glorioustrainwrecks.com/node/4986

    The game is already quite code-heavy in each scene so I want to stick to doing it in the stylesheet if at all possible. Thanks anyway.
    Sage wrote: »
    I don't have a good handle on CSS, but I can maybe offer you another way to accomplish it.

    How about this:

    (From @L )
    More importantly, though, is that you can declare a "header" or "footer" for every passage by using the tag 'header' or 'footer'. These can contain displayed text (like a special HUD, etc.) but more likely it will be used to hold prerender/postrender code, such as (replace:) macros that can selectively alter the text of every passage in the story.

Sign In or Register to comment.