••• EXAMPLE 3

Target a  specific  and  global  window at the same time

Scroll entry 1

identifier                      : my scroll notes
selector | target link          : #NavigationBar1
selector | target window        : #Layer1
axis                            : xy
...
...
run on load                     : true
run on call                     : Call_Scroll_1
••• EXAMPLE 1

Scroll on a WB Bookmark or Object  - (global - target window)


identifier                      : my scroll notes
selector | target link          : document
selector | target window        : window
axis                            : xy
...
...
run on load                     : true
run on call                     : Call_Scroll_1
CONTROLLING THE SCROLL

Settings for module | scroll can also be set programmable

PROGRAMMABLE SCROLL CONTROL

Settings can be   get   and   set   by using the   this   inside the   callback | before   property

example:

this.duration

  
some of the options:
   duration
   axis
   queue
   offset
   easing

The callback functions also allows some arguments   (anchor - on all)

example:

anchor.id = current link/anchor target id
We can also set a specific   link   target with the   selector | target link   which is specifically useful if we want to target a
specific   target window   and a global   target window   at the same time
When the global window is targeted, the specific targeted window (as a side effect) will start to scroll aswell
This can be subdued by using   specific   target links
__________________________________________________________________________
more info on   module | scroll   see here Properties
more info on   module | scroll   see here Online Tutorials
credits: john resig
advanced!
MODULE SCROLL - OVERVIEW
Horizontal - Vertical - Diagonal
Page Scrolling
PLUGIN
EXPLAIN ?

module | scroll properties can be used to create horizontal, vertical  or  diagonal page scroll motion
- in sequence or at the same time
- a  specific  link or window  or a   global   link and window can be set
bookmark:
Link to        : Internal Web Page/Page in this Project
Bookmark       : bookmark1

OR

object:
Link to        : Web Site/External Web Address
URL            : #Shape1
A  specific  window can be targeted by setting the   selector |  target window   property
••• EXAMPLE 2

Scroll on a WB Bookmark or Object inside a Layer1  - (specific - target window)


identifier                      : my scroll notes
selector | target link          : document
selector | target window        : #Layer1
axis                            : xy
...
...
run on load                     : true
run on call                     : Call_Scroll_1
...

Here the target window set to a Layer1 will create a scroll toward the bookmark or object ,  contained  inside a Layer1  (specific)
NOTE: set the Layer overflow to scroll, hidden or auto
Scroll entry 2

identifier                      : my scroll notes
selector | target link          : #wb_TabMenu1
selector | target window        : window
axis                            : xy
...
...
run on load                     : true
run on call                     : Call_Scroll_1

Here the 1st entry uses a Webbuilder NavigationBar component to scroll a specific window target, a Layer1
The 2nd entry uses a Webbuilder TabMenu to scroll the global window
Both windows can now scroll without affecting each other
If we want to use Images as   specific   target link and use a class to target them
we can use the   code modification | target link is class   property
PREBLOCK OVERLAY ?

The   code modification | preblock   property can be used to assign an   easy tools | preblock   to display on page scroll
Create a preblock overlay with   easy tools | preblock   and use the   run on call   to assign the preblock overlay
Most likely   easy tools | preblock   will be set up like this ...
••• EXAMPLE 4

Specific target link as Image set by class


identifier                                : my scroll notes
selector | target link                    : .myClass
selector | target window                  : window
...
...
run on load                               : true
run on call                               : Call_Scroll_1
...
code modification | target link is class  : true
...

add the class for  the Image object(s) used in the   HTML   -   inside tag   or   Inside anchor   -   class = 'myClass'
••• EXAMPLE

Preblock set and removed by run on call


...
overlay | opacity          : 0.4
...
preload text | text        : SCROLLING PAGE ... PLEASE WAIT ...
...
timer | wait               : 0        -----------+    most likely we want the preblock
timer | fade out           : 500                 +--- to set instant on scroll start, then fade out
timer | remove             : 0        -----------+    and instant remove on scroll end
pageload | timer           : false
pageload | redirect        :
pageload | callback        :
run on load mode           : run on call
run on call                : Call_Preblock_1  
<----- call
code modification | target : window
...

And in   module | scroll   the property   preblock | run on call   is set like ...

preblock | run on call : Call_Preblock_1  <---------- called
GOTO ONLINE DEMO
Adding a link to a bookmark or an object will now create a smooth scroll toward the bookmark or object  (global)
In Webbuilder we can set the link like this