Question

As seen on this website here, I am trying to replicate the fade transition between the three tabs when each one is clicked. I don’t know if I’m missing something or I am just a moron, but I can’t seem to find the coding in the source to make the hidden/visible events.

I would appreciate it greatly if someone can point it out to me, or suggest an easy alternative to put in there.

Thanks in advance.

Answer 1

It’s actually being done via jQuery:

$(".content").each(function() {
    var container = this
    var tabbodies = $(this).find(".tabbody")
    var tabs = $(this).find(".tab")
    if (!isMobile) tabs = tabs.not(".news .tab")
    tabs.click(function(e) {
    e.preventDefault()
    var self = this
    var body = this.hash ? $(this.hash) : $(this).next(".tabbody")
    tabs.not(this).removeClass("current")
    $(this)[isMobile ? "toggleClass": "addClass"]("current")
    tabbodies.not(body).stop(true, true)[isMobile ? "slideUp" : "hide"]()
    body.stop(true, true)[isMobile ? "slideToggle" : "fadeIn"]()
    if (isMobile) $.scrollTo(container, 500, {offset: {top: -45}})
}) 

Using Firebug, you can see it in script.js on line 245.