Skip to main content

Forums

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

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #172507
    AsteroidMonkey
    Participant

    Hi,

    I’m looking to do similar to the button changes in this website. Its the large buttons at the bottom of the page that say “IT & OT Convergence” etc.

    I’m assuming they’re done with JS, has anyone seen a tutorial on how to do a similar state change?

    Cheers,
    Marc

    #172517
    Paulie_D
    Moderator

    They are done with JS but it could be done with pure CSS.

    There are many tutorials on CSS transitions and JS animations….Google is your friend.

    #172519
    Chromawoods
    Participant

    This site in particular that you are mentioning are using a very simple technique, in which the panels are absolutely positioned with bottom:0. Then, they use jQuery’s slideDown/slideUp, which actually pushes the content upwards when using slideDown because of the bottom:0 positioning.

    Made a pen if you’re interested

    #172571
    Chromawoods
    Participant

    That being said… yeah it could be done with CSS transitions I guess. :)

    #172574
    Chromawoods
    Participant

    Just updated the pen. Now there’s also a CSS solution in there. But I think IE 9 and lower will not like it.

    #172588
    AsteroidMonkey
    Participant

    Cheers Chromawoods! Really appreciate your help on that :)

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