Template:InnerFade

    Table of contents
    No headers
    /*
    
    Author: rberinger
    jQuery Author Website: http://medienfreunde.com/deutsch/weblog/aus_der_praxis.html?nid=162
    Versio: 1.0
    
    Usage:
    InnerFade(Id or Class: str?, options: map? , Styles: str?)
    
    Parameters:
        id:  Must start with # for id or . for a class
        options: a map of values as defined below
        styles: any valid css styling
    
     Options:
        animationtype: 'fade' or 'slide'
        speed: Fade or Slide Speed in milliseconds or (slow, normal, fast)
        timeout: Time between the fades in milliseconds (2000 = 2secs)
        type: 'Sequence', 'Random' or 'Random_start' (then will continue in sequence)  
        containerheight: height of the containing element in any css-height-value
    
    
    EXAMPLE:
    InnerFade{id: '#news', 
              options:{animationtype: 'fade', 
                       timeout: 3000}, 
              styles: 'ul#news{border: 1px solid #ccc;padding: 2em;background:  yellow;list-style-type:none;}'};
    */
    
    
    
    var id = ($id ?? $0 ?? ''); /* If start with # then id if start with . then class */
    var opts = ($options ?? $1 ?? {animationtype: 'slide', speed: 2000, timeout: 5000, type: 'sequence', containerheight: 'auto'});
    var css = ($styles ?? $2 ?? '');
    var myOptions = {animationtype: 'slide', speed: 2000, timeout: 5000, type: 'sequence', containerheight: 'auto'};
    
    // Append or change the passed in options from the defaults
    let myOptions ..= opts;
    
    <html><head>
        <script type="text/javascript" src="http://medienfreunde.com/lab/innerfade/js/jquery.js"></script> 
        <script type="text/javascript" src="http://medienfreunde.com/lab/innerfade/js/jquery.innerfade.js"></script> 
        <script type="text/javascript"> "
            $(document).ready(
                function(){
                    $('" ..id .."').innerfade("..JSON.emit(myOptions)..");
            });
        "</script>
    
    // I'm not quite sure yet how to best handle the CSS
    <style type="text/css">
        css;
    </style>
    
    </head></html>
    
    
    Tag page
    You must login to post a comment.

    Copyright © 2011 MindTouch, Inc. Powered by