This is because it is a native browser object from the Document Object Model (DOM) which intern is quick & click responsive. i.e. just like the App Slider on Iphone Store.
Create titles using the following HTML Format > Headings H2, H3 or H4 to automatically create named anchor tags when the 'Table of Contents' is inserted.
The TOC automatic named anchor is hidden by the Google Sites system but is visible in the page source in the browser.
[Right click page and select "Inspect element" or F12]
e.g. The rendered HTML will look like this :
Slider Tile 1
Insert > 'Table of Contents' ('TOC') in a separate column
Layout > Column from the menu.
In TOC properties [Cog Icon] > clear the width to maximise.
The Table of Content for this page , the named anchor automatically get added to the formatting headings:
Save the page , and when not in page edit mode Copy and Paste [Bottom up is sometimes easier to make the selection of the TOC text] the table of contents text to get the all named anchor links as pure HTML links. i.e. .../#TOC-SliderTitle
You can modify the names and remove numbers even delete headings you don't require for you slider. Remove the formating by selecting the entire pasted TOC using Tx menu button OR CTRL + \ [Control and Backslash] to remove borders and other formatting.
1 HTML Slider No jQuery
1.1 Slider Text Example:
1.1.1 Slider Title 1
1.1.2 Slider Title 2
1.1.3 Slider Title 3
1.2 Slider Image Gallery Example:
1.2.1 Slider Image 1
1.2.2 Slider Image 2
1.2.3 Slider Image 3
Slider Text Example:
Slider Title 1
Slider Title 2
Slider Title 3
Slider Image Gallery Example:
Slider Image 1
Slider Image 2
Slider Image 3
Finally place the links in a separate column or even sidebar to the content you want to slide up and down. You can then place the Slider content where ever you want on the content page, once they have a Heading format [i.e. Format > Heading 3].
You should keep the main Title just to have a page reference to return to.Yo can also have it fixed above the slider content always visible like in the manual example below.
Copy and paste the following HTML below into your Google Sites HTML page (Use the <HTML> button) . You can also try it in the LIVE HTML editor.
<h3>Slider Image Gallery Example:</h3>
<div style="height:550px;"><h4>Slider Image 1</h4></div>
<div style="height:550px;"><h4>Slider Image 2</h4></div>
<div style="height:550px;"><h4>Slider Image 3</h4></div>
The Last empty div <div style="height:550px;"></div> is important so that the page has enough space to move up and not move down to the content! Check the number of </div> to closing </div> to make sure content is in between the main
... content ...
Insert > Images
Insert > Table of Contents and you have your core slider navigation HTML ready to go.