JVautogallery - Automatic Gallery Creation
Automatically creates a gallery of all images on a page. You create a gallery by wrapping ALL <img src=... > inside div elements named "JVautogallery"
JVautogallery replaces ALL the images inside the 'div' with a gallery overlay. The selection control is coded like this:
<div id="JVautogallery>
<img src="location">
<img etc...> ... as many images as you like ...
</div>
One single "div" can add the gallery feature to all the images on a page. Put the first <div id="JVautogallery"> at the top and then the ending </div> at the end. You can have one to many "div" sections. Each "div" area adds the Gallery feature to all the images discovered. NOTE: Any other text or content not an <img> inside the 'div' section is removed.
Image Description
To put a description on an image, use alt="any description" in an image for a description. Either do this in CC editor source mode or in the CC editor, click the image, right click, pick Properties and then select Alternative Text
Image Border Color
To set a gallery image border color, set the background-color. Do this in source mode by entering style="background-color:yellow;" (yellow example).
The border color is then used for the next images until the color is changed again. The default is white.
See this link for Color Names
After you create the JVautogallery div sections, add this script to the end your page in editor source mode
<script src="https://www.classcreator.com/000/7/7/0/13077/userfiles/file/html/JVautozoomgallery.js"></script>
EXAMPLE - with multiple DIV sections
All html and image before this point stay as they are.
Start of Gallery images 1
<div id="JVautogallery">
</div>
Above </div> markes the End of First Images that will be combined into a Gallery Section
Start of Gallery images 2
- all images past this area defined by the "div" are combined into a single gallery. Any other data is erased.
<div id="JVautogallery">
</div>
Above </div> markes the End of Second set of Images that will be combined into a Gallery Section
Start of Gallery images 3
<div id="JVautogallery">
</div>
Above </div> markes the End of Third set of Images that will be combined into a Gallery Section
All data and images after the "DIV" is displayed again