3D Gallery For DotNetNuke

How the 3D Gallery works

The 3D Gallery is constructed like a carousel where only the back section is visible.
Any images added to the 3D Gallery are distributed evenly over the complete carousel. Therefore, the distance between the images is determined by the size of the carousel and the number of images displayed. The size of the carousel can be defined by the setting Radius.

Because of the three-dimensional perspective of the Gallery, the size of the images shown depends on the extension of the carousel. The larger the carousel, the smaller the images in the background. To modify the size of the images, the focus of the Gallery can be moved backwards or forwards with the setting Focus. If you increase the Focus value, the images move forward and appear larger, but at the same time, the visible section of the carousel and thus its perspective presentation are changed as well.

For optimum presentation, we suggest using between 10 and 70 images.

Examples:
To make the differences in the presentation clear, all galleries below are using the same images.

View of a gallery from above:

The same gallery with fewer images. The distance between the images has become larger:

A large gallery with 40 images. The size of the images has reduced automatically, so that all images could be fully displayed in the gallery:
(Radius: 800 / Focus: 250)

The same gallery with larger focus. The perspective has moved forward. The images now appear larger, but the three-dimensional effect is reduced:
(Radius: 800 / Focus: 600)

Close Move

3D Gallery for DotNetNuke 4.0 - Settings

Flash Player

Width: Specifies the width of the animation area.
Default: 600

Height: Specifies the height of the animation area.
Default: 350

Position Left: Specifies the margin between the animation window and the left border of the module.
Default: 0

Position Top: Specifies the margin between the animation window and the upper border of the module.
Default: 0

Quality: Specifies the animation's quality level.
Default: High
High: Favors quality of animation. (recommended)
Medium: Favors execution speed and does not take quality of animation into account unless it's possible.
Low: Favors execution speed.

Show Menu: Specifies what type of menu appears when the user Right-clicks the animation area.
Default: not checked
Checked: Shows the full menu, which gives the user several options to enhance or control playback.
Not Checked: Shows a menu that contains only the About option and the Settings option.

Gallery

Radius: Specifies the width of the Gallery.
Default: 400
(see help file "How the Gallery works")
Experiment with the settings Radius and Focus to obtain the desired configuration of your Gallery.

Focus: Specifies the spatial extension of the Gallery.
Default: 250
Depending on the set value, the gallery moves backwards or forwards, and the images appear smaller or larger.
(see help file "How the Gallery works")
Experiment with the settings Radius and Focus to obtain the desired configuration of your Gallery.

Vertical View: Specifies the vertical view on the Gallery.
Default: 0

Speed: Specifies the speed of rotation of the Gallery.
Default: 6

Position Center Top: Specifies the position of the Gallery starting from the center of the animation window.
Default: 0. Plus and minus values are accepted. e.g -20
The standard position of the Gallery is in the center of the animation window. With this setting the Gallery can be shifted vertically.

Random Images: Specifies the number of images shown randomly at any time. Images are taken randomly from the complete selection contained in the Gallery.
Default: -

Background Color: Specifies the background color of the Gallery.
Default: #ffffff

Show Background Image: Specifies whether an image should appear as background image.
Default: not checked
Note: If a background image is used, performance can be affected to some degree. If fastest performance is a top priority, you may consider other design options.

Background Image: Specifies the path of an image displayed as the background image.
Default: -

Background Top: Specifies the margin between the animation window and the upper border of the background image.
Default: 0

Background Left: Specifies the margin between the animation window and the left border of the background image.
Default: 0

Navigation

Rotation: Specifies the rotation options of the Gallery.
Default: Auto

Auto: The Gallery rotates automatically.
Buttons: Navigation buttons are displayed by which the Gallery rotation can be directed to run clockwise or counter-clockwise.
Custom: The navigation buttons can be positioned anywhere.

Effects - Image Reflection

Visible: Specifies if a reflection should be visible.
Default: checked
Hint: When the glow effect is activated, no reflection will be shown!

Alpha: Specifies the alpha transparency value of the reflection.
Default: 50

Height: Specifies the height of the reflection.
Default: 4

Distance: Specifies the distance the reflection starts from the bottom of the image.
Default: 0

Effects - Image Glow

Enabled: Specifies if a glow effect should be displayed on an image when the curser is placed over it.
Default: not checked
Hint: When the glow effect is activated, no reflection will be shown!

Color: Specifies the color of the glow effect.
Default: #ff0000

Alpha: Specifies the alpha transparency value of the glow effect.
Default: 100

Blur: Specifies the extent of the glow effect.
Default: 32

Strength: Specifies the intensity of the glow effect.
Default: 2

Quality: Specifies the presentation quality of the glow effect.
Default: High

Effects - Image Rotation

Enabled: Specifies if an image should feature a rotation effect when the curser is placed over it.
Default: not checked

Speed: Specifies the speed of the rotation effect.
Default: 15

Radians: Specifies the degree of rotation of the image.
Default: 180

Effects - Image Zoom

Enabled: Specifies if a zoom effect is to be displayed in an image when the curser is placed over it.
Default: not checked

Rate: Specifies the zoom rate of the effect.
Default: 5

Dynamic / Static Textfields

HTML: Specifies that the textfield supports a subset of standard HTML tags.
Important! If this option is checked the settings for Align, Bold, Italic, Font, Font Color, Font Size, Leading and Underline are ignored.
Default: not checked

The following HTML tags are supported:
Anchor: <a href="http://www.3dcarousel.com">Link</a>
Bold: Lorem ipsum ex vel prima
Font: <fon 
Paragraph:Lorem ipsum ex vel prima
Underline: Lorem ipsum ex vel prima
Break: Lorem ipsum ex vel prima
Image: <img src="/Portals/0/..\..\..\portals\0\logo.gif".>
List Item: <li>Lorem ipsum Lorem ipsum</li>

Anti-Aliasing: Specifies that the font faces should be rendered more legible.
Default: not checked

The setting enables high quality rendering and should be used by preference when using small fonts. (< 10 px)
HTML: When selecting anti-aliasing, the standard font (Verdana) will be used automatically! Please don’t define any fonts in HTML! If you do, the text will not be displayed!
Text invaild!
Text vaild!

Align: Specifies the horizontal alignment of the text.
Default: center

Bold: Specifies whether the text is boldface.
Default: not checked

Italic: Specifies whether the text is italicized.
Default: not checked

Font: Spezifies the font name of the text.
Default: not checked

Font color: Spezifies the color of the text.
Default: #222222

Font size: Spezifies the size of the text.
Default: 14

Leading: Specifies the space in pixels between lines.
Default: 0

Underline: Specifies whether the text is underlined.
Default: not checked

Position Left: Specifies the margin between the text and the left border of the animations window.
Default: 0 | 110 | 220 | 330

Position Top: Specifies the margin between the text and the upper border of the animations window.
Default: 10 | 10 | 10 | 10

Width: Specifies the width of the textfield.
Default: 100 | 100 | 100 | 100

Height: Specifies the height of the textfield.
Default: 30 | 30 | 30 | 30

Topmost: Specifies that the text field is shown on top of other elements.
Default: checked

Background Color:
Specifies the background color of the textfield.
Default: -

Show Border: Specifies that a frame will be displayed around the text field.
Default: not checked
Hint: Showing the contours can also be helpful for positioning the text field!

Border Color: Specifies the border color.
Default: -

Gallery Images

Image Path: Specifies the path of the image displayed in the Gallery.

Image Link | Target: Specifies the link to the page to be loaded when clicking on the image.
Target:
_blank : The new page will be shown in a new browser window.
_self: The new page will be shown in the Gallery window.
_parent: The new page will be shown in the parent page.
_top: The new page will be shown in the topmost frame.

Textfield 1 (dynamic) / Textfield 2 (dynamic): Specifies the text to be shown in Textfield1 / Textfield2.
Any details with regard to the presentation of the text can be defined in the area "Dynamic Textfields".

Note: If you have checked option "HTML" under "Dynamic Textfields" you can make use of the following HTML tags for designing your text:
Anchor: <a href="http://www.3dcarousel.com">Link</a>
Bold: Lorem ipsum ex vel prima
Font: <fon 
Paragraph:Lorem ipsum ex vel prima
Underline: Lorem ipsum ex vel prima
Break: Lorem ipsum ex vel prima
Image: <img src="/Portals/0/..\..\..\portals\0\logo.gif".>
List Item: <li>Lorem ipsum Lorem ipsum</li>

Close Move