Jump to content

Daellus

Members
  • Posts

    4
  • Joined

  • Last visited

Posts posted by Daellus

  1. [UPDATED IN ANSWERS] Attached updated files.

     

    I'm trying to extend a rather well-used animation formula using css.

    To start, here's the basic animation: http://www.daellusknights.com

    The banner text is set to a specific rotation,  Animation 1. (two instances)

    Likewise, the "glow" effect is also animated. (Animation 2)

    What my goal is, the "layers" of each word are going to be statically faded out

    by setting each layer slightly more transparent than the one before it.

    This includes setting the text, stroke, and glow opacity.

    I'm using "h1:nth-child(#){code}" to set the primary properties of each

    layer such as Z-offset, etc. This is not a problem for making a transparency

    fade with the letters themselves.  What I want to do is also apply the same

    transparency fade to the glow, but still have the colors animated.

    Is there a shorthand way to do this, or will it be necessary to synchronize

    a separate animation for each layer of the block of text? Each with it's own

    color animation, but with a set opacity?

    Thank you in advance!

    Christopher W.

    index.html

    dk-anim.css

  2. For whatever reason, anytime I use "position: sticky" in whatever form

    whether it's browser supported or through the Stickyfill.js it breaks the

    w3-bar navigation menu. w3schools.com obviously has a way to make

    it work. But I can't. Sticky off - dropdown menu works perfect. Stick ON

    and the menu button clicks but the dropdown content is not displayed.

    Or at the very least it's not visible if it is.

    http://dev.daellusknights.com/index.html <-- Sticky ON (broken)

    http://dev.daellusknights.com/index2.html <-- Sticky OFF (works)

    Is this a known issue or am I just missing something. Currently

    working with MS Edge and latest Chrome on Win 10 Pro (dev)

×
×
  • Create New...