Fixed Block Size

jlg - January 27, 2009 - 17:55
Project:Couloir Slideshow
Version:6.x-1.x-dev
Component:User interface
Category:feature request
Priority:normal
Assigned:Unassigned
Status:by design
Description

Because I have random image sizes in my slideshow the block keeps re-sizing, whick in-turn moves the other blocks on that side of the page.

is it possible to set a fixed block size?

#1

cluke009 - January 27, 2009 - 21:54

I am having a similar problem. Except I just want to completely remove the initial easing animation. I am looking through the functions but my javascript is still not that strong. Any suggestions?

#2

jlg - February 3, 2009 - 11:09
Category:feature request» support request

#3

ComputerWolf - February 3, 2009 - 19:08
Category:support request» feature request
Status:active» by design

If you want a fixed size and are familiar with php and css at all is this:

In couloir_slideshow.module and locate this code:

$html = '<!-- slideshow ' . $delta . ' -->
<div id="OuterContainer">
<div id="PhotoContainer">
<img id="Photo" src="' . $url . '/img/c.gif" alt="Photo: Couloir" />
<div id="LinkContainer">
    <a href="#" id="PrevLink" title="Previous Photo"><span>Previous</span></a>
    <a href="#" id="ViewPhoto" rel="lightbox" title="View Photo"><span>View Photo</span></a>
    <a href="#" id="NextLink" title="Next Photo"><span>Next</span></a>
    </div>
</div>
</div>'

And add another DIV around the OuterContainer like so:

$html = '<!-- slideshow ' . $delta . ' -->
<div id="FixedContainer">
<div id="OuterContainer">
<div id="PhotoContainer">
<img id="Photo" src="' . $url . '/img/c.gif" alt="Photo: Couloir" />
<div id="LinkContainer">
    <a href="#" id="PrevLink" title="Previous Photo"><span>Previous</span></a>
    <a href="#" id="ViewPhoto" rel="lightbox" title="View Photo"><span>View Photo</span></a>
    <a href="#" id="NextLink" title="Next Photo"><span>Next</span></a>
    </div>
</div>
</div>
</div>'

And then in /css/couloir.css add:

#FixedContainer {
position:relative;
height: 500px;
width: 500px;
padding:0;
margin: 0 auto;
}

And make sure you set the correct dimensions that you want it fixed to. I have not tested this, so it may not work as expected, let me know if you need anymore help.

#4

ruess - December 31, 2009 - 00:34

This was very helpful thanks!

 
 

Drupal is a registered trademark of Dries Buytaert.