https://github.com/holyshared/exhibition
This plugin beautifully arranges the image. Moreover, the image is smoothly moved.
https://github.com/holyshared/exhibition
Last synced: 7 days ago
JSON representation
This plugin beautifully arranges the image. Moreover, the image is smoothly moved.
- Host: GitHub
- URL: https://github.com/holyshared/exhibition
- Owner: holyshared
- Created: 2009-12-14T23:49:36.000Z (over 16 years ago)
- Default Branch: master
- Last Pushed: 2011-07-08T04:37:09.000Z (almost 15 years ago)
- Last Synced: 2025-10-07T01:58:17.918Z (9 months ago)
- Language: JavaScript
- Homepage: http://holyshared.github.com/Exhibition/
- Size: 2.12 MB
- Stars: 2
- Watchers: 0
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Exhibition
===========
This plugin beautifully arranges the image. Moreover, the image is smoothly moved.
How to use
----------
A description necessary to use Exhibition is as follows.
The mark putting of HTML becomes as follows.
#HTML
The description of CSS becomes as follows.
It becomes full screen specifying 100% in height for body and the html element.
#CSS
div#container {
overflow: hidden;
}
ul.exhibition {
overflow: hidden;
list-style: none;
position: relative;
}
ul.exhibition li {
position: absolute;
}
ul.exhibition li a {
display: block;
padding: 10px;
background: #333333;
}
ul.exhibition li a:hover {
background: #3c94af;
}
ul.exhibition li.active a {
background: #3c94af;
}
Javascript is described at the end. The height of the screen is acquired and it specifies it for container element (*div#container*,*ul#exhibition*).
It is necessary to note it because it doesn't become full screen if this processing is not done.
#JS
window.addEvent("domready", function() {
var height = (Browser.Engine.trident && Browser.Engine.version <= 6) ? document.documentElement.clientHeight : window.innerHeight;
var container = $("container");
var exhibition = $("exhibition");
container.setStyle("height", height);
exhibition.setStyle("height", height);
var images = exhibition.getElements("li");
new Exhibition(exhibition, images, {"defaultIndex": Math.round((images.length - 1)/2)});
});
Options
-------
All options have default values assigned, hence are optional.
### Version 1.0.1
* **defaultIndex**: (int) Index initial value of image
* **duration**: (int) duration of animation.
* **transition**: (string) Transition of animation. ex: expo:in:out, sine:in
* **blank**: (int) Interval between image and image.
* **onPreload**: When reading all images is completed, it is generated.
* **onNext**: It is generated before it changes into the following image.
* **onPrev**: It is generated before it changes into the previous image.
* **onSelect**: When selected, it is generated.
* **onActive**: When the image becomes active, it is generated.
Screenshots
-----------
Wordpress Theme Exhibition
-----------
The theme of this wordpress is being developed.
The one on the way can be confirmed on a site here.
[Exhibition](http://exhibition.sharedhat.com/)
