Grow your CSS skills. Land your dream job.

How is a site like this made?

  • # June 10, 2013 at 3:21 pm

    Hey I’m fairly new to web design, I have posted on some other forums asking a similar question but have gotten no responses I was hoping you guys could help me out.

    My goal is to design a website similar to this website http://d10studio.com.mx/
    I want the site to be a one page design with no scrolling. I love the animations and how the transition from one page to another. I’m guessing this uses JS? I’d love to know what this type of page is called and how they are made.

    # June 10, 2013 at 3:31 pm

    You’re likely not getting a response because the explanation of how to “build a site like that” is massive. You say you’re new – how new? You’ll need a lot of knowledge in the areas of HTML5 and CSS3, as well as Javascript and JQuery … and unless I miss my guess, WordPress and PHP. I think this is a WordPress theme, but I’m saying that just of glancing at it, I haven’t looked at the code to verify.

    You build a site like that by knowing what you’re doing. Asking a question like you’re asking eludes to the fact that you don’t. I don’t mean that in a condescending manner, not at all. It’s okay to be new to something, we all started that way. I would recommend http://teamtreehouse.com if you want to learn how to making something like this.

    Alternatively, you could go to http://themeforest.com and find a WordPress theme you like, pay $45 for it and be on your merry way. Depends if you want a website or if you want to learn how to build a website.

    # June 10, 2013 at 3:33 pm

    hi, isn’t it a bit difficult for a beginner? Actually the site is mostly built with Javascript.

    Try inspecting elements and resources with the developper tools in your browser.

    Nothing is impossible to a willing heart :)

    # June 10, 2013 at 3:34 pm

    I’d venture to guess that the reason no one has responded to your question on other forums is because 1) you don’t provide a link showing what you’ve done and, similarly, 2) your question strongly suggests that you want others to provide to the code for you.

    Perhaps you might consider providing a link showing what you’ve done and point to specific areas with which you need some assistance.

    # June 10, 2013 at 3:35 pm

    Parallax page is the name and it’s made with jquery. It’s done with chained, delayed animations.

    There are manny plugins like this on the net. Here is one:

    http://kreaturamedia.com/layerslider-responsive-wordpress-slider-plugin/

    Also, I’ve found this for you, check it out:

    http://streetsmash.com/parallax-scrolling-plugins/

    # June 10, 2013 at 7:39 pm

    Thanks jozsef just what I was looking for!

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".