I’d love to use this (hoverbox mod and all). But I also get the non-working links. The URL appears in the status bar, but clicking on the image doesn’t activate the link. Using Mac browsers as in the post above.

Has this been addressed?

Also, the zip download does not contain the resizer.js . Don’t know if it’s necessary for anything here, but I get the activity error of its absence.

I’m a noobie to js so any help you can give me woulod be great.

thanks

/**
* function: moveTo
* Actually moves the images based on the position provided by function
*
* parameters:
* currentPos - {int} Position to move to
*/
moveTo: function(currentPos){
var x = currentPos;
this.currPos = currentPos;
var width = Element.getWidth(this.elem) * 90 / 100; /* HACK */
var height = Element.getHeight(this.elem);

var top = this.elem.offsetTop;
var size = width * 0.49;
var biggest = height;
var zIndex = this.stackCount;
this.stack.each(function(elem, index){

Element.absolutize(elem);
elem.setAttribute(”index”, index);

if (this.options.useReflection) {
elem.down(1).setAttribute(’index’, index);
}
var z = Math.sqrt(10000 + x * x * 1) + 100;
var xs = x / z * size + size;
elem.setStyle({
left: ((xs - 40 / z * biggest) - 22) + “px”, /* HACK */
top: (30 / z * size + 0) + “px”,
width: (100 / z * biggest) + “px”,
height: (110.25 / z * biggest) + “px”,
textAlign: “center”
});
//console.log(elem);
elem.style.zIndex = zIndex;

if (x < 0)
zIndex++;
else
zIndex–;
x += this.options.flex;

}.bind(this));
},

Unfortunately I’m completely at a loss when it comes to Javascript. This is why the Grails solution appealed to me.

If you find someting please feel free to share

http://www.nabble.com/Richui-flow-widget-issues-td16477103.html

From these comments it looks like I should use square images to solve one of my issues (i.e. the issue of not being centered) bt I’m still at a loss for the link not working

Fabian: Can you submit your code as well? So that I can integrate it? I am working on the image resize issue where non-square images can be rendered properly.

Thanks guys!

In the method initialize :

if(this.options.enableKeyboard) {
document.observe(’keyup’, (function(e) {
var code = e.keyCode;
if(37 == code) this.previous();
if(39 == code) this.next();
}).bind(this));
}

if(this.options.enableMouse) {
var eventType = Prototype.Browser.Gecko ? “DOMMouseScroll” : “mousewheel”;

Event.observe(this.elem, eventType, (function(e) {
this.enableMouse(e);
}).bind(this), false);

if (this.useCaptions) {
Event.observe(this.captionHolder, eventType, (function(e) {
this.enableMouse(e);
}).bind(this), false);
}
}

Additional methods in the class :

decreaseIndex: function(e) {
if(this.currIndex > 0)
this.currIndex–;
},

increaseIndex: function(e) {
if (this.currIndex < this.getStackCount() - 1)
this.currIndex++;
},

previous: function(e) {
this.decreaseIndex();
this.toCurrentIndex();
},

next: function(e) {
this.increaseIndex();
this.toCurrentIndex();
},

enableMouse: function(e) {
Event.wheel(e) < 0 ? this.next() : this.previous();
},

toCurrentIndex: function(e) {
this.goTo(this.currIndex);
this.updateSlider(this.currIndex);
}

I also suggest to change the disable links method. I think that changing the href attribute is not a good idea because it can be use by another script (ex : lightbox).

In the following method I just suppress the default link behaviour :

disableLinks: function(){
this.elem.select(”a”).each(function(a){
a.observe(’click’, function(e) {
e.preventDefault();
});
});
}

And finally the wheel method from Frank Monnerjahn :

Object.extend(Event, {
wheel: function(event){

var delta = 0;
if (!event) event = window.event;

if (event.wheelDelta) {
delta = event.wheelDelta/120;
if (window.opera) delta = -delta;

} else if (event.detail) {
delta = -event.detail/3;
}

return Math.round(delta); //Safari Round
}

});

Hope this helps.