Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Pure CSS3 Star Wars Lightsaber Checkboxes

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #44887
    scotchio
    Participant

    Hey guys,

    New here, so hopefully I am posting in the correct spot (or that this is allowed). I just wanted to show off a new snippet I made today.

    It uses the checkbox “hack” (:checked ~ div) to create click events using just CSS. It’s not really meant to be super UI/UX friendly, but it’s still pretty neat. Anyways, here’s the links. Let me know what you guys think.

    Thanks!

    http://codepen.io/ncerminara/pen/KzurJ

    http://scotch.io/demos/pure-css3-star-wars-lightsaber-checkboxes

    #135655
    Anonymous
    Inactive

    That’s pretty cool. Would be even better if you could add sound effects. And i’m not sure if it’s just me but there is light left behind when disable the lightsaber.

    #135697
    scotchio
    Participant

    I know, it happens on my machine, too. I think it’s related to the experimental css3 features being used and memory. Thanks for checking it out

    #135770
    scotchio
    Participant

    Interesting, this fixed the light being left behind issue.

    Per: http://www.reddit.com/r/css/comments/1entbi/pure_css3_star_wars_lightsaber_checkboxes/ca2l4tv

    #135772
    scotchio
    Participant

    div {
    -webkit-transform : translateZ(0);
    -o-transform : translateZ(0);
    -moz-transform : translateZ(0);
    -ms-transform : translateZ(0);
    transform : translateZ(0);
    }

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.