CODEWITHSUNDEEP
jqueryslideshowsupersized
fabrikgrafik
fabrikgrafik

Reputation: 13

Showing content below Supersized slideshow

I'm trying to show content below a full-screen slideshow that behaves normally. Only when you scroll down should the remaining content be revealed. So on load the slideshow should still be 100% in height and width.

I tried put a margin top that is the same size as the browser height (detected with js) and put the slideshow position absolute but that did not work ...

Would love to hear your thoughts on this, thanks a lot!

example: http://www.fabrikgrafik.be/slider/ (I'm trying to get the red content div below the slideshow without losing the slideshow functionality)

Upvotes: 0

Views: 1757

Answers (2)

SpYk3HH
SpYk3HH

Reputation: 22570

It's really simple, don't change anything from what it was aminute ago except to add the following 2 lines of jQuery:

// made edit to hide content till slideshow is rdy
$("#content-wrapper").css("margin-top", $("#supersized").height()).show();
$(window).resize(function(e) { $("#content-wrapper").css("margin-top", $("#supersized").height()); });

updated jsFiddle

Also, you might change this CSS:

#controls-wrapper { display: none; position: absolute; } /* from fixed */

Upvotes: 1

VIDesignz
VIDesignz

Reputation: 4783

I figured it out....css style

 #redDivId {position:absolute; top:100%;}

Check out this FIDDLE

Upvotes: 0

Related Questions