Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Darrin Malone
929 PointsHow would I achieve this?
Hey guys,
I am dev a wordpress e-commerce site for a friend and I had this idea I wanted to use. I have no idea as to how id go about this but I wanted to basically have the homepage be sort of two different doors the user can click on and go through. I want to have this be animated with html 5 or jquery or something. They dont have to be exactly doors, they could be sliding blocks or windows or anything. Pretty much split right down the middle.
Also, if its possible, wanted to know if I could also ad a video to this landing page.
4 Answers
Efen Oko
930 PointsIt's not really hard if you understand jquery a bit. You can just make two divs or images that split the page. The jquery should be something like this:
$(".thedoorblockthing").click(function () {
$(this).hide("slide", { direction: "up" }, 1000);
});
A video can just be accomplished with simple html inside one of them divs
If you dont understand any of this you hava a long way to go but if you need help for the whole thing just let me know.
Zac Gordon
Treehouse Guest TeacherHey guys! I'm going to retag this from "wordpress" to "jquery" and "html5" so you can hopefully get some more support from the right folks!
Darrin Malone
929 PointsThanks!
Andrew Chalkley
Treehouse Guest Teacher+1 Efen :)
@Darrin try a couple of things out. Maybe plain ol' jQuery is enough or there could be a plugin to do snazzier things with CSS3 too :)