-
Hi!
I love this theme and have been working to support pages in the Kwick slider.
I’ve got just about everything working to support slider support for my pages as well as posts.
I did this with a couple of plugins (category for pages, featured images for pages) as well as modify the style.css with a couple of addition styles.I have one issue I can’t seem to resolve.
When a ‘page’ is displayed, the ‘entry-container’ does not get sized to fit within slide. If I change the class to ‘post’ in Firebug or Chrome, it is resized correctly the next time I mouse over it.
For example, this is a page:li class="slide" style="left: 0px; margin: 0px; position: absolute; width: 230px;"> <div id="post-171" class="post-171 page type-page status-publish hentry category-last-days"> <div class="opacity" style="display: block;"></div> <a class="overlay" rel="bookmark" href="http://blah-blah.blah/pagetest/"></a> <div class="entry-container" style="display: none;"> </div> </liAnd by simply changing ‘page‘ to ‘post‘ as in here, the sizing then comes out correct:
<div id="post-171" class="post-171 post type-page status-publish hentry category-last-days">If I add a set style with a fixed width in style.css for .entry-container it will work for both posts and pages, but is not dynamic like the original and preferred ‘posts’ method.
I suspect there is something I’m missing or not understanding about ‘kwicks.js’ although I have fiddled with lots of stuff within it sometimes with great enjoyment.
Any thoughts?
Kind Regards,
–DougOK, I think I’ve figured why this is happening.
The CSS for the ‘page’ is set to a width of 940px. The entry-container is somewhere around 940px wide when you look at it in Firebug when rendered from a page.
.page-title, .single .entry-title, .page .entry-title { width:940px; margin:0 auto; color:#FFF; font-size:48px; line-height:48px; }If the width here is set to anything where the sum of it and the margins is greater than the width of the slider(?), the entry-container doesn’t get resized properly. I can set it way below like 200px, and the entry-container still gets rendered to fit the slider perfectly just like a ‘post’ — of course changing the width in this this element whacks lots of other page settings (title, for one.)
I suspect it probably has to do with the calculations of the containers in the kwicks.js, which is still quite a mystery to me.
Now looking for the right combination of class attributes I can set to only affect the entry-container.
Regards,
–DougThis seems to have fixed it.
#slider .post .entry-title { font-size:27px; } #slider .page .entry-title { width:400px; margin-left:0px; font-size:27px; }I had duplicated each of the elements that said ‘post’ and replaced with ‘page’ in the CSS file, but when I added the width and margin settings to .entry-title then the title and excerpt for pages within slide are now rendered correctly to fit the slider.
You must be logged in to reply to this topic.