Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Center area post/pages (http://forum.bytesforall.com/forumdisplay.php?f=32)
-   -   [SOLVED] Horizontal Scrolling (http://forum.bytesforall.com/showthread.php?t=15783)

bswb97 Oct 26, 2011 05:19 PM

[SOLVED] Horizontal Scrolling
 
I've been looking at non-standard designs for a more creative approach to portfolio websites. Is there a way to get Atahualpa to scroll horizontally indefinitely (similar to the vertical scroll)? I see some artists are doing this now.

I was thinking of using Flexcroll scripting to do it but can it be as simple as making the layout some obscene size? I think that would work but it would be a set size and I would like the scrollbar to be proportional to the content.

Something like this:
http://www.lauraflippen.com/

lmilesw Oct 26, 2011 08:32 PM

You could just multiply the width of all the images to come up with a width for the site. You will also have to use perhaps a background image instead of the logo or maybe you can use absolute positioning to keep the logo in view when you scroll.

Play around with different ideas. There is someone else currently in the forums who is doing something like this. See this thread.

bswb97 Oct 27, 2011 05:31 PM

I think we're going to go with the simpler "set layout width" method.

Now, I do want to keep text fairly normal for a few non-portfolio pages. Can I use page ID as a custom CSS insert?

Something like this for portfolio (long scrolling)

div#wrapper.page-id-1 {
width: 100000px;
}

And something like this for normal

div#wrapper.page-id-2 {
width: 980px;
}

Would that do the trick?

juggledad Oct 27, 2011 06:08 PM

no that won't work, the page-id-nn is assigned to the <body...> statement so you need
HTML Code:

body.page-id-nn rest of css selector {...}

lmilesw Oct 27, 2011 06:29 PM

Did you try them? I would set the width in the theme options to the wide width and use CSS to narrow the width of the few pages you want at "normal" width.
I am not sure where you got your CSS from but by using Firebug I came up with the following that should work. You of course need to change the id number to the page you want to affect.
HTML Code:

body.page-id-114 div#wrapper {
width: 900px;
}


bswb97 Oct 27, 2011 09:48 PM

Got my div and ID mixed up but your code works great Larry! Thanks! This is much easier than tinkering with Flexcroll.


All times are GMT -6. The time now is 02:26 AM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.