Joomla: Panoramic Image Viewer Plugin

Written by Andreas Berger

Saturday, 19 April 2008 07:47

The bretteleben.de "Panoramic Image Viewer" plugin for Joomla 1.5 is a simple plugin to display 360 degree images in content items. It works with JavaScript, neither flash nor any other player is required.
You decide if the panorama scrolls automatically on pageload or is directed with control elements.

bretteleben.de "Panoramic Image Viewer" Plugin for Joomla 1.5

The bretteleben.de Plugin Panoramic Image Viewer works with Joomla 1.5.

The plugin offers two different modes - with controls or scrolling automatically..
If you activate "Start at pageload" in the backend, the panorama starts scrolling on pageload. If you deactivate the option, beyond the panorama control elements are shown, which can be used to start/stop the panorama.

New in Version 1.1.0:

- align the panorama left-center-right
- choose to use text or buttons as control elements
- choose to scroll left or right with autoscroll enabled
- choose the starting-position of your image
- use more than one panorama in one article
- use more than one article with one or more panoramas on bloglayout-pages like frontpage, category, section
- link the panorama
- set the target for the link to top or blank

Installation and Usage

A step by step tutorial on installation and usage can be found at Howto Plugin .

Notice before update:
If you have modified the style sheet bepiv.css, save it before update, it gets overwritten.

Demo

Compatibility

The plugin is tested successful with Joomla 1.5.6, 1.5.7 and 1.5.8. Anyway, using it aside with one or another existing plugin/modul/component may bring to light problems i haven't foreseen.
I suggest a test run before using it on a live site and stand by for your questions and suggestions.

As far as JavaScript and CSS are involved, the plugin is tested by now as follows:


Internet Explorer	6
Internet Explorer	7.0	J
Internet Explorer	8b2	J
Firefox	3.0.5	J
Firefox	3.1b2	J
Opera	9.60	J
Safari	3.11	J
Chrome	1.0.x	J

License

The plugin is licensed under the GNU Public License (www.gnu.org/copyleft/gpl.html).

update Version: 1.1.0

Version 1.1.0 - 2009-02-14

- align the panorama left-center-right
- choose to use text or buttons as control elements
- choose to scroll left or right with autoscroll enabled
- choose the starting-position of your image
- use more than one panorama in one article
- use more than one article with one or more panoramas on bloglayout-pages like frontpage, category, section
- link the panorama
- set the target for the link to top or blank

Version 1.0.2 - 2008-11-07

- set CSS-Values for padding, margin and border of the panorama-image to zero per default
- exchanged "onload" with "window.addEvent('load',f);" to prepare for multiple use of the event

Version 1.0.1 - 2008-11-03

- the CSS-classes of arrows do not correspond between script and stylesheet bepiv.css: corrected
- Firefox spits when width and height of scaled images are delivered with decimal places: corrected

Version 1.0.0 - 2008-10-25

Support

If you have questions or suggestions, please use the comment-function. Records about the behavior of this extension (positive or negative) are most welcome.

If you use this extensions, you have the possibility to post a rating and a review at joomlaos.de or extensions.joomla.org . Furthermore I appreciate everyone, supporting me with a link back to www.bretteleben.de on his/her website. The extension itself does not produce any hidden links, eastereggs or whatever.

Download

The ZIP-archive contains the plugin, by downloading it you agree to the terms of the GNU Public License. The ZIP-Archive can be used for both, upgrade and fresh installation.

Downloads:
File	Last Modified
plugin_bepiv_1.1.0.zip	2009-02-15

Last Updated ( Wednesday, 13 January 2010 09:09 )

Comments (57)

hab die Antwort über CSS gelöst:

.besps_slides {
z-index:-1;
}

Ein super Plugin, wirklich toll. Habe es getestet und in meine Website integriert.

Dennoch bleibt mir eine Frage ungeklärt:

Ich möchte dass die Buttons nicht unter der Slideshow sich befinden, sondern, dass diese auf dem Bild positioniert sind.

Wenn ich margin-top:-10px; beispielsweise zuweise, verschwinden die Buttons hinter der Slideshow. Das ist aber doof.

Wo kann ich das HTML oder PHP bearbeiten?
Oder wie kann ich sonst bestimmen, dass die Buttons auf der slideshow positioniert werden?

Ich möchte die Buttons durch transparente Buttons austauschen und sie über die Slideshow postionieren( nicht drüber, sondern über - im Sinne von "auf" der Slideshow).

Ich freue mcih auf Feedback

Hallo Andreas!

Wenn Du Dir die Anleitung durchliest, dann siehst Du, dass der Wert "Scroll Step" die Schrittweise in Pixel festlegt, um die das Bild bei jeder Bewegung weiterverschoben wird. Modernere Browser sind anscheinend so tolerant, die Angabe 0.5 hinzunehmen, der Internet Explorer 6 nicht. Recht hat er, es gibt keine halben Pixel.
Wenn Du das Scrollen verlangsamen möchtest, dann hast Du neben der Schrittweite aber auch noch den Parameter "Scroll Speed", vergrößere den Wert und das Panorama scrollt langsamer.

Gruß
Andreas

Hallo Andreas,
leider wird bei einem Step Scroll von 0.5 im IE 6 das Bild unbewegt stehen.
Gibt es eine Möglichkeit den Wechsel zu verlangsamen, ohne dass man 0, Einstellung benutzten muss?

Bei der Geschwindigkeit von 1, ist der Panoramawechsel immer noch zu schnell, so dass Besucher von dem Inhalt abgelenkt werden.

Danke dir für die Mühe,
über ein kurzes Feedback wehre ich sehr erfreut!!!

Gruß
Andreas

Hi Björn!

I confess, at the moment I'm a little mad at this plugin, or myself, or both :)
Once a week or so I have it on my screen because I would like to come up with a new version that allows to display 3D panoramas too - and put it away after some time because what I have up till now is not fast enough for practical use. This is the main reason why there have not been updates for the plugin and the module for a while.
Anyway - If I am not able to get a working version up and running soon, I will put this aside and yes, as soon as this happens other improvements will bubble up the todo-list :)

Best regards
Andreas

First of all thanks for the work at that plugin. Very comfortable usage and perfect for such Joomla rockies like me ;-).
Now my question. Is there an ongoing for request of Stranger (43 Montag, 01. Juni 2009 um 18:10)? Is it planed to imlement such a feature?
Many thanks in advance

Hi JL!

No. To allow the plugin to scroll endless into both directions the single image is used three times side by side.

If you want to use the plugin like a normal horizontal scroller, the way to achieve this would be to stitch together the images offline.

Best regards
Andreas

hi, i would like to know whether or not this plugin is able to add more than one images in one goal? If yes, how to? Thanks.

Hallo Andreas,

danke für den Tipp, dass hat super geklappt! Euren schnellen Support möchte ich auch mal loben. Es macht wirklich Spaß Plugins von Entwicklern zu nutzen, die sowas wie Ihr auf die Beine stellt. Klasse!

Beste Grüße
Jens

PS: Hier könnt Ihr Euch das Plugin-Bild anschauen:

http://www.wander-pfade.de/bärensteine/kleiner-baerenstein-wanderung1

Hallo Jens!

Mal angenommen, Dein Panorama ist eingestellt auf 400 Pixel Breite und 100 Pixel Höhe und Du möchtest eine Border von 1 Pixel.

In bepiv.css setzt Du dann folgende Werte für die Klasse .bepiv_panorama0:

.bepiv_panorama0 {border:1px solid red;clip:rect(0px,402px,102px,0px);}

Worum es geht, Du musst den sichtbaren Ausschnitt des DIVs um die doppelte Rahmenbreite erweitern.

Gruß
Andreas

yvComment v.1.15.0