ifxRotatingBanner 1.3 - Documentation

• Live Demo

  • Example

  • Parameters

    Key	Data Type	Values	Description	Select Params
    *domID* autogenerated	string	dom ID	Gets ID of DOM object	-
    *navID* autogenerated	string	nav ID	Gets ID of NAV object	-
    bannerInitial	integer	0 *default, {integer} (number of banners)	Iniitial banner to show, 0 based index
    bannerAutoRotate	boolean	true *default, false	Sets banner to auto rotate
    bannerPauseRotationOnHover	boolean	true *default, false	Pauses rotation upon hovering over the banner. Continues after mouseout
    bannerLoopRotation	-	true *default, false	TBD	-
    bannerShadow	-	false *default, true	TBD	-
    bannerHeight	integer	260 *default for horizontal nav 350 *default for vertical nav	Sets the height of the banner in pixels
    bannerWidth	integer	720 *default for horizontal and vertical nav	Sets the width of the banner in pixels
    bannerSpeed	integer	5 *default, {integer}	Banner delay in seconds
    bannerTransition	-	"left" *default, "right", "up", "down", "fade"	TBD	-
    bannerSpeedTransition	integer	1 *default, {integer}	Duration of transition in seconds
    bannerEasing	string	"easeInOutBack" *default	Banner animation effect. *See jQuery effects
    navVisible	-	true *default, false	TBD	-
    navOrientation	string	"horizontal" *default, "vertical"	Sets the orientation of nav	Horizontal Vertical
    navHeight	integer	83 *default for horizontal nav, auto, {integer} 350 *default for vertical nav, auto, {integer}	Sets the height of the nav in pixels
    navWidth	integer	720 *default for horizontal nav, auto, {integer} 260 *default for vertical nav, auto, {integer}	Sets the width of the nav in pixels
    navClass	string	"banner-nav-con" *default, {"classname"}	CSS class for nav appearance
    navEasing	string	"linear" *default	Navigation animation effect. *See jQuery effects
    navMeter	-	"right" *default, "left", ""	TBD	-
    navStopAutoRotationOnClick	-	true *default, false	TBD	-
    ifxDeepLink	boolean	true *default, false	Turns on and off deep link ability. *See ifxDeepLink
    anchor	string	window.location.hash *url anchor: "##"	Deep link anchor *<li> id
    dataSource	string	URL	Builds banner using the .dat data file ajaxed from the specified URL

    
    
    
    
    
    

  • Code

    <link media="screen" href="http://www.rogers.com/cms/ifx/css/ifx.css" type="text/css" rel="stylesheet"> <script type="text/javascript" language="javascript" src="http://www.rogers.com/cms/ifx/js/jquery.min.js"></script> <script type="text/javascript" language="javascript" src="http://www.rogers.com/cms/ifx/js/jquery.easing.min.js"></script> <script type="text/javascript" language="javascript" src="http://www.rogers.com/cms/ifx/js/ifx.js"></script>
  Live References
  • Rogers Home Landing:  http://www.rogers.com/web/Rogers.portal
  • Rogers Wireless Landing:  http://www.rogers.com/web/Rogers.portal?_nfpb=true&_pageLabel=WRLS_HOME
• Dependencies
  <!-- Should Already be included in Page [START] --> <link href="http://www.rogers.com/cms/ifx/css/ifx.css" type="text/css" rel="stylesheet" media="screen" /> <script src="http://www.rogers.com/cms/ifx/js/jquery.min.js" type="text/javascript"></script> <script src="http://www.rogers.com/cms/ifx/js/ifx.min.js" type="text/javascript"></script> <!-- Should Already be included in Page [END] -->
• Version Notes

  1.3

  • added ability to link to a data source to populate the banners

  1.0

  • deeplinkable

Versions

• 1.0
• 1.3