9 posts
  • Has been part of the Envato Community for over 4 years
  • Has collected 1+ items on Envato Market
bradherman says
I’m making a site right now for a client that has a small content div (850px x 300px) and tabs along the top. When you click on the tabs, I have it set up so that the content slides into view within the frame. Without posting all my code, it’s essentially set up like so (doing inline styling to convey the message):
<div id="content-frame" style="overflow: hidden; width: 850px; height: 300px;">
<div id="all-content" style="height: 300px; width: largewidth;">
  <div id="index" style="width: 850px; height: 300px; display: inline;">CONTENT</div>
  <div class="wrapper" id="about">CONTENT</div>
  .
  .
  .
  </div>
</div>
On a link click, the jQuery takes the #all-content wrapper and shifts it left or right depending on which link is clicked. However, the client doesn’t like that when making larger jumps between pages, the content moves super fast and is almost dizzying as it scrolls by. I want a way to hide/show the content in this sliding manner without having to scroll past every page…

I’ve thought about adding “display: hidden” to all but the active wrapper and then using jQuery to set display: block to the target content, shift the box left or right, and then hide the previously active content. Is there any clean way to achieve something like this? I haven’t actually coded it yet, but I’d imagine setting the display from hidden to block would push things around and mess up the “left” attribute.

Any help would be appreciated!

ps. I have wave invites if anyone needs one!

960 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
+4 more
jeffeatworld says

Try the codaslider plugin (google it). I believe with that you can set the speeds and such.

Good luck.

9 posts
  • Has been part of the Envato Community for over 4 years
  • Has collected 1+ items on Envato Market
bradherman says

I looked at coda slider, but unfortunately it simply does what I wrote… The client doesn’t like that sliding between pages goes over all the pages. They want, regardless of which page your skipping to, for the content to just slide into view without sliding over all the other content.

by
by
by
by
by
by