以下是 js斜式画中画切换特效代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<TITLE>js斜式画中画切换</TITLE>
<META content=IE=7 http-equiv=X-UA-Compatible>
<META content="text/html; charset=utf-8" http-equiv=Content-Type>
<LINK rel=stylesheet type=text/css href="css/zzsc.css" media=screen>
<script type=text/javascript src="js/mootools.js"></script>
<script type=text/javascript src="js/utilities-core.js"></script>
<META name=GENERATOR content="MSHTML 8.00.6001.19222">
</HEAD>
<BODY>
<div id=everything class=everything>
<div id=promo_area>
<div class=group_container>
<div class="banner group"><!-- --></div>
<div class="banner group"><!-- --></div>
<div class="banner group"><!-- --></div>
</div>
</div>
<div id=controls>
<div id=carousel class=hidden>
<div id=left_arrow class=png title=向左侧滚动图像>
<A href="javascript:void(0);"> <SPAN class=screenReading>导航到左侧</SPAN></A> </div>
<div id=carousel_container>
<div class=carousel_group>
<div class=carousel_box>
<A href="javascript:void(0);"> <SPAN class=screenReading>圆盘式控制器, 导航到横幅区域按回车键</SPAN></A> </div>
</div>
</div>
<div id=right_arrow class=png title=向右侧滚动图像>
<A tabIndex=104 href="javascript:void(0);"> <SPAN class=screenReading>导航到右侧</SPAN></A>
</div>
</div>
</div>
<div id=central_messaging class=hidden>
<div id=hho_msg>
<div class="content basic first">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>惠普中国在线商店特别促销</SPAN></A>
<div class=image>
<a href="#"><img class=js_masked_image title=images/img01.jpg ></a>
</div>
<div class=default_content>
<SPAN class=text_top>惠普中国在线商店特别促销<BR></SPAN><SPAN class=text_bottom>六一玩游戏赢双重好礼</SPAN>
</div>
<div class=over_content>
<div class=title>惠普儿童节特别策划</div>
<div class=message>回归童年一起游戏赢六一双重好礼！</div>
<div class=cta>
<div id=promohhol10 class="button png">
<A class="white hand" href="#"><SPAN class=center_side><SPAN class=text>了解更多</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A> </div>
</div>
</div>
</div>
<div class="content basic">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>惠普最新促销</SPAN></A>
<div class=image>
<a href="#"><img class=js_masked_image title=images/img02.jpg ></a>
</div>
<div class=default_content><SPAN class=text_top>惠普最新促销<BR></SPAN><SPAN class=text_bottom>产品优惠惊喜无限</SPAN></div>
<div class=over_content>
<div class=title>浏览最新产品优惠</div>
<div class=message>选购惠普打印机，电脑，打印耗材及产品 <BR>配件</div>
<div class=cta>
<div id=promohhol40 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>立即体验</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
<div class="content basic last">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>教您如何辨别真伪耗材</SPAN></A>
<div class=image>
<a href="#"><img title=images/img03.jpg ></a>
</div>
<div class=default_content><SPAN class=text_top>教您如何辨别真伪耗材<BR></SPAN><SPAN class=text_bottom>提供多种辨别真伪耗材的途径</SPAN></div>
<div class=over_content>
<div class=title>为您提供多种<BR>辨别真伪耗材的途径</div>
<div class=message>教您如何辨别真伪耗材</div>
<div class=cta>
<div id=promohhol50 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>了解更多</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
</div>
<div id=smb_msg>
<div class="content basic first">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>惠普中国在线商店特别促销</SPAN></A>
<div class=image>
<a href="#"><img class=js_masked_image title=images/img04.jpg ></a>
</div>
<div class=default_content>
<SPAN class=text_top>惠普中国在线商店特别促销<BR></SPAN><SPAN class=text_bottom>六一玩游戏赢双重好礼</SPAN>
</div>
<div class=over_content>
<div class=title>惠普儿童节特别策划</div>
<div class=message>回归童年一起游戏赢六一双重好礼！</div>
<div class=cta>
<div id=promohhol10 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>了解更多</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
<div class="content basic">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>惠普最新促销</SPAN></A>
<div class=image>
<A href="#"><img class=js_masked_image title=images/img05.jpg ></A>
</div>
<div class=default_content><SPAN class=text_top>惠普最新促销<BR></SPAN><SPAN class=text_bottom>产品优惠惊喜无限</SPAN></div>
<div class=over_content>
<div class=title>浏览最新产品优惠</div>
<div class=message>选购惠普打印机，电脑，打印耗材及产品 <BR>配件</div>
<div class=cta>
<div id=promohhol40 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>立即体验</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
<div class="content basic last">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>教您如何辨别真伪耗材</SPAN></A>
<div class=image>
<A href="#"><img title=images/img06.jpg ></A>
</div>
<div class=default_content><SPAN class=text_top>教您如何辨别真伪耗材<BR></SPAN><SPAN class=text_bottom>提供多种辨别真伪耗材的途径</SPAN></div>
<div class=over_content>
<div class=title>为您提供多种<BR>辨别真伪耗材的途径</div>
<div class=message>教您如何辨别真伪耗材</div>
<div class=cta>
<div id=promohhol50 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>了解更多</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
</div>
<div id=leb_msg>
<div class="content basic first">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>惠普中国在线商店特别促销</SPAN></A>
<div class=image>
<A href="#"><img class=js_masked_image title=images/img07.jpg ></A>
</div>
<div class=default_content>
<SPAN class=text_top>惠普中国在线商店特别促销<BR></SPAN><SPAN class=text_bottom>六一玩游戏赢双重好礼</SPAN> </div>
<div id=sml_CN_ZH_HHO_PSG_OLS_61_promo_hho_basic class=over_content>
<div class=title>惠普儿童节特别策划</div>
<div class=message>回归童年一起游戏赢六一双重好礼！</div>
<div class=cta>
<div id=promohhol10 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>了解更多</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
<div class="content basic">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>惠普最新促销</SPAN></A>
<div class=image>
<A href="#"><img class=js_masked_image title=images/img03.jpg ></A>
</div>
<div class=default_content><SPAN class=text_top>惠普最新促销<BR></SPAN><SPAN class=text_bottom>产品优惠惊喜无限</SPAN></div>
<div id=sml_CN_ZH_HHO_ALL_Promo_Index_HHO_hho_basic class=over_content>
<div class=title>浏览最新产品优惠</div>
<div class=message>选购惠普打印机，电脑，打印耗材及产品 <BR>配件</div>
<div class=cta>
<div id=promohhol40 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>立即体验</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A> </div>
</div>
</div>
</div>
<div class="content basic last">
<A class="js_banner_tabindex banner_focus" href="javascript:void(0)"><SPAN class=screenReading>教您如何辨别真伪耗材</SPAN></A>
<div class=image>
<A href="#"><img title=images/img09.jpg ></A>
</div>
<div class=default_content><SPAN class=text_top>教您如何辨别真伪耗材<BR></SPAN><SPAN class=text_bottom>提供多种辨别真伪耗材的途径</SPAN></div>
<div id=sml_CN_ZH_HHO_IPG_original_supplies_hho_basic class=over_content>
<div class=title>为您提供多种<BR>辨别真伪耗材的途径</div>
<div class=message>教您如何辨别真伪耗材</div>
<div class=cta>
<div id=promohhol50 class="button png">
<A href="#"><SPAN class=center_side><SPAN class=text>了解更多</SPAN><SPAN class=arrow> </SPAN></SPAN><SPAN class=right_side> </SPAN></A>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script type=text/javascript src="js/zzsc.js"></script>
<script type=text/javascript>
var rtl=false;
</script>
</BODY>
</HTML>
JS代码(utilities-core.js):
var isIE6=navigator.userAgent.toUpperCase().indexOf("MSIE 6.0")!=-1;
var isIE7=navigator.userAgent.toUpperCase().indexOf("MSIE 7.0")!=-1;
var isIE8=navigator.userAgent.toUpperCase().indexOf("MSIE 8.0")!=-1;
var isIE9=navigator.userAgent.toUpperCase().indexOf("MSIE 9.0")!=-1;
var isIE=navigator.userAgent.toUpperCase().indexOf("MSIE")!=-1;
var isFF=navigator.userAgent.toUpperCase().indexOf("GECKO")!=-1;
var gtIE8=isIE8||isIE9;
var CHKOverrides=new Class({
overrides:null,setOverrides:function(){
if(($defined(this.options))&&($defined(this.options.overrides))){
this.overrides=$H(this.options.overrides);
if(($defined(this.overrides))&&(this.overrides.getLength()>0)){
this.overrides.each(function(value,key){
if($type(value)==='function'){
this[key]=value;
}
}
.bind(this));
}
}
}
}
);
var CHKClassName=new Class({
getClassName:function(){
var w=$H(window);
return w.keyOf(this.constructor);
}
}
);
var CHKControl_Base=new Class({
Implements:[Events,Options,CHKOverrides,CHKClassName],options:{
name:null,showClass:null,hideClass:null,selectedClass:null,deselectedClass:null,enabledClass:null,disabledClass:null,stopPropagation:true,preventDefault:false,useFx:false,fxOpenStylePre:null,fxOpenStyle:null,fxOpenStylePost:null,fxCloseStylePre:null,fxCloseStyle:null,fxCloseStylePost:null,fxSelectedStylePre:null,fxSelectedStyle:null,fxSelectedStylePost:null,fxDeselectedStylePre:null,fxDeselectedStyle:null,fxDeselectedStylePost:null,fxEnabledStylePre:null,fxEnabledStyle:null,fxEnabledStylePost:null,fxDisabledStylePre:null,fxDisabledStyle:null,fxDisabledStylePost:null,fxWait:false,fxDuration:500,fxTransition:Fx.Transitions.Sine.easeInOut}
,controlEl:null,timer:null,uid:null,isOpen:true,isSelected:false,isEnabled:true,inTransition:false,fx:null,initialize:function(control,options){
this.controlEl=$(control);
this.setOptions(options);
this.setOverrides();
var tempHash,keys,styles,count;
tempHash=$H({
}
);
if($defined(this.controlEl)){
this.uid=this.controlEl.uid;
if((!$defined(this.options.name))&&(this.controlEl.className.contains('js_name_'))){
this.controlEl.className.split(' ').each(function(item,index){
if(item.contains('js_name_')){
this.options.name=item.replace('js_name_','');
}
}
.bind(this));
}
if(($defined(this.options.useFx))&&(this.options.useFx)){
if($defined(this.options.fxOpenStyle)){
if($type(this.options.fxOpenStyle)==='object'){
tempHash=$H(this.options.fxOpenStyle);
keys=tempHash.getKeys();
styles=$H(this.controlEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=true;
}
}
}
if($defined(this.options.fxCloseStyle)){
if($type(this.options.fxCloseStyle)==='object'){
tempHash=$H(this.options.fxCloseStyle);
keys=tempHash.getKeys();
styles=$H(this.controlEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=false;
}
}
}
}
else{
if($defined(this.options.showClass)){
switch($type(this.options.showClass)){
case'string':if((this.options.showClass!=="")&&(this.controlEl.hasClass(this.options.showClass))){
this.isOpen=true;
}
break;
case'object':tempHash=$H(this.options.showClass);
keys=tempHash.getKeys();
styles=$H(this.controlEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=true;
}
break;
}
}
if($defined(this.options.hideClass)){
switch($type(this.options.hideClass)){
case'string':if((this.options.hideClass!=="")&&(this.controlEl.hasClass(this.options.hideClass))){
this.isOpen=false;
}
break;
case'object':tempHash=$H(this.options.hideClass);
keys=tempHash.getKeys();
styles=$H(this.controlEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=false;
}
break;
}
}
}
if(this.options.useFx){
this.fx=new Fx.Morph(this.controlEl,{
wait:this.options.fxWait,duration:this.options.fxDuration,transition:this.options.fxTransition}
);
this.fx.addEvent('onComplete',this.transitionCompleteHandler.bind(this));
this.fx.addEvent('onStart',this.transitionStartHandler.bind(this));
}
}
}
,render:function(resize){
if(!$defined(resize)){
resize=false;
}
this.fireEvent('onBeginRender',this);
if($defined(this.customRender)){
this.customRender(resize);
}
this.fireEvent('onEndRender',this);
}
,customRender:$empty,toggleShow:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
if(this.isOpen){
this.hide(stopEventFiring);
}
else{
this.show(stopEventFiring);
}
}
}
,show:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
this.isOpen=true;
if(this.options.useFx){
if($defined(this.options.fxOpenStylePre)&&(!this.inTransition)){
this.controlEl.setStyles(this.options.fxOpenStylePre);
}
this.inTransition=true;
this.fx.start(this.options.fxOpenStyle);
}
else{
if(!$defined(this.options.showClass)){
this.controlEl.setStyles({
visibility:'visible',display:'block'}
);
}
else{
if($type(this.options.showClass)==='object'){
this.controlEl.setStyles(this.options.showClass);
}
else{
if(this.options.showClass!==""){
this.controlEl.addClass(this.options.showClass);
}
if($defined(this.options.hideClass)&&($type(this.options.hideClass)==='string')&&this.controlEl.hasClass(this.options.hideClass)){
this.controlEl.removeClass(this.options.hideClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onshow',this);
this.fireEvent('onShowStateChange',this);
}
}
,hide:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
this.isOpen=false;
if(this.options.useFx){
if($defined(this.options.fxCloseStylePre)){
this.controlEl.setStyles(this.options.fxCloseStylePre);
}
this.fx.start(this.options.fxCloseStyle);
}
else{
if(!$defined(this.options.hideClass)){
this.controlEl.setStyles({
visibility:'hidden',display:'none'}
);
}
else{
if($type(this.options.hideClass)==='object'){
this.controlEl.setStyles(this.options.hideClass);
}
else{
if(this.options.hideClass!==""){
this.controlEl.addClass(this.options.hideClass);
}
if($defined(this.options.showClass)&&($type(this.options.showClass)==='string')&&this.controlEl.hasClass(this.options.showClass)){
this.controlEl.removeClass(this.options.showClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onhide',this);
this.fireEvent('onShowStateChange',this);
}
}
,showDelay:function(timeDelay,stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($chk(timeDelay)){
this.timer=this.show.bind(this).delay(timeDelay);
}
}
,hideDelay:function(timeDelay,stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($chk(timeDelay)){
this.timer=this.hide.bind(this).delay(timeDelay);
}
}
,clearTimer:function(){
$clear(this.timer);
}
,toggleSelected:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
if(this.isSelected){
this.deselect(stopEventFiring);
}
else{
this.select(stopEventFiring);
}
}
}
,select:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
this.isSelected=true;
if(this.options.useFx){
if($defined(this.options.fxSelectedStylePre)&&(!this.inTransition)){
this.controlEl.setStyles(this.options.fxSelectedStylePre);
}
this.inTransition=true;
this.fx.start(this.options.fxSelectedStyle);
}
else{
if(!$defined(this.options.selectedClass)){
this.controlEl.setStyles({
visibility:'visible',display:'block'}
);
}
else{
if($type(this.options.selectedClass)==='object'){
this.controlEl.setStyles(this.options.selectedClass);
}
else{
if(this.options.selectedClass!==""){
this.controlEl.addClass(this.options.selectedClass);
}
if($defined(this.options.deselectedClass)&&($type(this.options.deselectedClass)==='string')&&this.controlEl.hasClass(this.options.deselectedClass)){
this.controlEl.removeClass(this.options.deselectedClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onSelected',this);
this.fireEvent('onSelectedStateChange',this);
}
}
,deselect:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
this.isSelected=false;
if(this.options.useFx){
if($defined(this.options.fxDeselectedStylePre)){
this.controlEl.setStyles(this.options.fxDeselectedStylePre);
}
this.fx.start(this.options.fxDeselectedStyle);
}
else{
if(!$defined(this.options.deselectedClass)){
this.controlEl.setStyles({
visibility:'hidden',display:'none'}
);
}
else{
if($type(this.options.deselectedClass)==='object'){
this.controlEl.setStyles(this.options.deselectedClass);
}
else{
if(this.options.deselectedClass!==""){
this.controlEl.addClass(this.options.deselectedClass);
}
if($defined(this.options.selectedClass)&&($type(this.options.selectedClass)==='string')&&this.controlEl.hasClass(this.options.selectedClass)){
this.controlEl.removeClass(this.options.selectedClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onDeselected',this);
this.fireEvent('onSelectedStateChange',this);
}
}
,toggleEnabled:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
if(this.isEnabled){
this.disable(stopEventFiring);
}
else{
this.enable(stopEventFiring);
}
}
}
,enable:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
this.isEnabled=true;
if(this.options.useFx){
if($defined(this.options.fxEnabledStylePre)&&(!this.inTransition)){
this.controlEl.setStyles(this.options.fxEnabledStylePre);
}
this.inTransition=true;
this.fx.start(this.options.fxEnabledStyle);
}
else{
if(!$defined(this.options.enabledClass)){
this.controlEl.setStyles({
visibility:'visible',display:'block'}
);
}
else{
if($type(this.options.enabledClass)==='object'){
this.controlEl.setStyles(this.options.enabledClass);
}
else{
if(this.options.enabledClass!==""){
this.controlEl.addClass(this.options.enabledClass);
}
if($defined(this.options.disabledClass)&&($type(this.options.disabledClass)==='string')&&this.controlEl.hasClass(this.options.disabledClass)){
this.controlEl.removeClass(this.options.disabledClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onEnabled',this);
this.fireEvent('onEnabledStateChange',this);
}
}
,disable:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.controlEl)){
this.isEnabled=false;
if(this.options.useFx){
if($defined(this.options.fxDisabledStylePre)){
this.controlEl.setStyles(this.options.fxDisabledStylePre);
}
this.fx.start(this.options.fxDisabledStyle);
}
else{
if(!$defined(this.options.disabledClass)){
this.controlEl.setStyles({
visibility:'hidden',display:'none'}
);
}
else{
if($type(this.options.disabledClass)==='object'){
this.controlEl.setStyles(this.options.disabledClass);
}
else{
if(this.options.disabledClass!==""){
this.controlEl.addClass(this.options.disabledClass);
}
if($defined(this.options.enabledClass)&&($type(this.options.enabledClass)==='string')&&this.controlEl.hasClass(this.options.enabledClass)){
this.controlEl.removeClass(this.options.enabledClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onDisabled',this);
this.fireEvent('onEnabledStateChange',this);
}
}
,transitionStartHandler:function(){
this.fireEvent('onTransitionStart',this);
}
,transitionCompleteHandler:function(){
if(this.isOpen){
if($defined(this.options.fxOpenStylePost)){
this.controlEl.setStyles(this.options.fxOpenStylePost);
}
}
else{
if($defined(this.options.fxCloseStylePost)){
this.controlEl.setStyles(this.options.fxCloseStylePost);
}
}
if(this.isSelected){
if($defined(this.options.fxSelectedStylePost)){
this.controlEl.setStyles(this.options.fxSelectedStylePost);
}
}
else{
if($defined(this.options.fxDeselectedStylePost)){
this.controlEl.setStyles(this.options.fxDeselectedStylePost);
}
}
if(this.isEnabled){
if($defined(this.options.fxEnabledStylePost)){
this.controlEl.setStyles(this.options.fxEnabledStylePost);
}
}
else{
if($defined(this.options.fxDisabledStylePost)){
this.controlEl.setStyles(this.options.fxDisabledStylePost);
}
}
this.inTransition=false;
this.fireEvent('onTransitionComplete',this);
}
,getByUid:function(uid){
if(($defined(uid))){
if($defined(this.uid)&&uid===this.uid){
return this;
}
}
return null;
}
,getByName:function(name){
if(($defined(name))){
if($defined(this.options.name)&&name===this.options.name){
return this;
}
}
return null;
}
}
);
var CHKCustomPopUp=new Class({
Implements:[Events,Options,CHKOverrides,CHKClassName],options:{
name:null,showEvent:'mouseenter',hideEvent:'mouseleave',enableTriggerToggle:false,enableTargetToggle:false,showTriggerClass:null,hideTriggerClass:null,showTargetClass:null,hideTargetClass:null,showDelay:null,hideDelay:null,alignment:null,stopPropagation:true,preventDefault:false,enableKeypress:true,useFx:false,fxOpenStylePre:null,fxOpenStyle:null,fxOpenStylePost:null,fxCloseStylePre:null,fxCloseStyle:null,fxCloseStylePost:null,fxWait:false,fxDuration:500,fxTransition:Fx.Transitions.Back.easeOut}
,triggerEl:null,targetEl:null,showEls:[],hideEls:[],triggerSize:null,popupSize:null,alignmentSet:false,isOpen:false,inTransition:false,timer:null,fx:null,uid:null,initialize:function(trigger,target,options){
var tempHash,keys,styles,count;
this.triggerEl=$(trigger);
this.targetEl=$(target);
this.setOptions(options);
this.setOverrides();
tempHash=$H({
}
);
if($defined(this.triggerEl)){
this.uid=this.triggerEl.uid;
if((!$defined(this.options.name))&&(this.triggerEl.className.contains('js_name_'))){
this.triggerEl.className.split(' ').each(function(item,index){
if(item.contains('js_name_')){
this.options.name=item.replace('js_name_','');
}
}
.bind(this));
}
this.triggerSize=this.triggerEl.getSize();
if(this.triggerSize.x===0&&this.triggerSize.y===0){
this.triggerSize.x=this.triggerEl.getStyle('width').toInt();
this.triggerSize.y=this.triggerEl.getStyle('height').toInt();
}
if($defined(this.options.showTriggerClass)){
switch($type(this.options.showTriggerClass)){
case'string':if((this.options.showTriggerClass!=="")&&(this.triggerEl.hasClass(this.options.showTriggerClass))){
this.isOpen=true;
}
break;
case'object':tempHash=$H(this.options.showTriggerClass);
keys=tempHash.getKeys();
styles=$H(this.triggerEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=true;
}
break;
}
}
if($defined(this.options.hideTriggerClass)){
switch($type(this.options.hideTriggerClass)){
case'string':if((this.options.hideTriggerClass!=="")&&(this.triggerEl.hasClass(this.options.hideTriggerClass))){
this.isOpen=false;
}
break;
case'object':tempHash=$H(this.options.hideTriggerClass);
keys=tempHash.getKeys();
styles=$H(this.triggerEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=false;
}
break;
}
}
}
if($defined(this.targetEl)){
if(!$defined(this.uid)){
this.uid=this.targetEl.uid;
}
if((!$defined(this.options.name))&&(this.targetEl.className.contains('js_name_'))){
this.targetEl.className.split(' ').each(function(item,index){
if(item.contains('js_name_')){
this.options.name=item.replace('js_name_','');
}
}
.bind(this));
}
this.popupSize=this.targetEl.getSize();
if(this.popupSize.x===0&&this.popupSize.y===0){
this.popupSize.x=this.targetEl.getStyle('width').toInt();
this.popupSize.y=this.targetEl.getStyle('height').toInt();
}
if(($defined(this.options.useFx))&&(this.options.useFx)){
if($defined(this.options.fxOpenStyle)){
if($type(this.options.fxOpenStyle)==='object'){
tempHash=$H(this.options.fxOpenStyle);
keys=tempHash.getKeys();
styles=$H(this.targetEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=true;
}
}
}
if($defined(this.options.fxCloseStyle)){
if($type(this.options.fxCloseStyle)==='object'){
tempHash=$H(this.options.fxCloseStyle);
keys=tempHash.getKeys();
styles=$H(this.targetEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=false;
}
}
}
}
else{
if($defined(this.options.showTargetClass)){
switch($type(this.options.showTargetClass)){
case'string':if((this.options.showTargetClass!=="")&&(this.targetEl.hasClass(this.options.showTargetClass))){
this.isOpen=true;
}
break;
case'object':tempHash=$H(this.options.showTargetClass);
keys=tempHash.getKeys();
styles=$H(this.targetEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=true;
}
break;
}
}
if($defined(this.options.hideTargetClass)){
switch($type(this.options.hideTargetClass)){
case'string':if((this.options.hideTargetClass!=="")&&(this.targetEl.hasClass(this.options.hideTargetClass))){
this.isOpen=false;
}
break;
case'object':tempHash=$H(this.options.hideTargetClass);
keys=tempHash.getKeys();
styles=$H(this.targetEl.getStyles(keys));
count=0;
keys.each(function(item,index){
if((styles.has(item))&&(styles.get(item)===tempHash.get(item))){
count++;
}
}
.bind(this));
if(count===keys.length){
this.isOpen=false;
}
break;
}
}
}
}
this.fx=new Fx.Morph(this.targetEl,{
wait:this.options.fxWait,duration:this.options.fxDuration,transition:this.options.fxTransition}
);
this.fx.addEvent('onComplete',this.transitionCompleteHandler.bind(this));
this.fx.addEvent('onStart',this.transitionStartHandler.bind(this));
if($defined(this.triggerEl)){
if($defined(this.options.showEvent)){
$splat(this.options.showEvent).each(function(event){
this.triggerEl.addEvent(event,this.showHandlerTrigger.bind(this));
}
.bind(this));
}
if($defined(this.options.hideEvent)){
$splat(this.options.hideEvent).each(function(event){
this.triggerEl.addEvent(event,this.hideHandlerTrigger.bind(this));
}
.bind(this));
}
if(this.options.enableKeypress){
this.triggerEl.addEvent('keypress',this.keypressHandlerTrigger.bind(this));
}
}
if($defined(this.targetEl)&&(this.targetEl!==this.triggerEl)){
if($defined(this.options.showEvent)){
$splat(this.options.showEvent).each(function(event){
this.targetEl.addEvent(event,this.showHandler.bind(this));
}
.bind(this));
}
if($defined(this.options.hideEvent)){
$splat(this.options.hideEvent).each(function(event){
this.targetEl.addEvent(event,this.hideHandler.bind(this));
}
.bind(this));
}
if(this.options.enableKeypress){
this.targetEl.addEvent('keypress',this.keypressHandler.bind(this));
}
}
this.render(false);
}
,render:function(resize){
if(!$defined(resize)){
resize=false;
}
this.fireEvent('onBeginRender',this);
if($defined(this.customRender)){
this.customRender(resize);
}
this.fireEvent('onEndRender',this);
}
,customRender:$empty,addShowElement:function(obj,showEvent){
if($defined(obj)){
if(!$defined(showEvent)){
showEvent='click';
}
$splat(showEvent).each(function(event){
obj.addEvent(event,this.showHandlerTrigger.bind(this));
}
.bind(this));
this.showEls.push(obj);
}
}
,addHideElement:function(obj,hideEvent){
if($defined(obj)){
if(!$defined(hideEvent)){
hideEvent='click';
}
$splat(hideEvent).each(function(event){
obj.addEvent(event,this.hideHandlerTrigger.bind(this));
}
.bind(this));
this.hideEls.push(obj);
}
}
,clearTimer:function(){
$clear(this.timer);
}
,show:function(stopEventFiring){
var triggerCoord,targetCoord,alignmentStyle,widthSign,widthSize,heightSign,heightSize;
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.triggerEl)&&$defined(this.options.showTriggerClass)){
if($type(this.options.showTriggerClass)==='object'){
this.triggerEl.setStyles(this.options.showTriggerClass);
}
else{
if(this.options.showTriggerClass!==""){
this.triggerEl.addClass(this.options.showTriggerClass);
}
if($defined(this.options.hideTriggerClass)&&($type(this.options.hideTriggerClass)==='string')&&this.triggerEl.hasClass(this.options.hideTriggerClass)){
this.triggerEl.removeClass(this.options.hideTriggerClass);
}
}
}
this.isOpen=true;
if($defined(this.targetEl)){
if(this.options.useFx){
if($defined(this.options.fxOpenStylePre)&&(!this.inTransition)){
this.targetEl.setStyles(this.options.fxOpenStylePre);
}
this.inTransition=true;
this.fx.start(this.options.fxOpenStyle);
}
else{
if(!$defined(this.options.showTargetClass)){
this.targetEl.setStyles({
visibility:'visible',display:'block'}
);
}
else{
if($type(this.options.showTargetClass)==='object'){
this.targetEl.setStyles(this.options.showTargetClass);
}
else{
if(this.options.showTargetClass!==""){
this.targetEl.addClass(this.options.showTargetClass);
}
if($defined(this.options.hideTargetClass)&&($type(this.options.hideTargetClass)==='string')&&this.targetEl.hasClass(this.options.hideTargetClass)){
this.targetEl.removeClass(this.options.hideTargetClass);
}
}
}
}
}
if(($defined(this.options.alignment))&&(this.alignmentSet===false)){
if(($defined(this.triggerEl))&&($defined(this.targetEl))){
triggerCoord=this.triggerEl.getCoordinates();
targetCoord=this.targetEl.getCoordinates();
widthSign='';
heightSign='';
if(targetCoord.width>triggerCoord.width){
widthSign='-';
widthSize=(targetCoord.width-triggerCoord.width);
}
else{
widthSize=(triggerCoord.width-targetCoord.width);
}
if(targetCoord.height>triggerCoord.height){
heightSign='-';
heightSize=(targetCoord.height-triggerCoord.height);
}
else{
heightSize=(triggerCoord.height-targetCoord.height);
}
switch(this.options.alignment){
case'horiz_center':alignmentStyle={
left:widthSign+(widthSize/2)+'px'}
;
break;
case'horiz_right':alignmentStyle={
left:widthSign+widthSize+'px'}
;
break;
case'vert_top':alignmentStyle={
top:'0px'}
;
break;
case'vert_center':alignmentStyle={
top:heightSign+(heightSize/2)+'px'}
;
break;
case'vert_bottom':alignmentStyle={
top:heightSign+heightSize+'px'}
;
break;
case'horiz_left':alignmentStyle={
left:'0px'}
;
break;
case'center_center':alignmentStyle={
left:widthSign+(widthSize/2)+'px',top:heightSign+(heightSize/2)+'px'}
;
break;
case'center_left':alignmentStyle={
top:heightSign+(heightSize/2)+'px',left:'0px'}
;
break;
case'center_right':alignmentStyle={
top:heightSign+(heightSize/2)+'px',left:widthSign+widthSize+'px'}
;
break;
case'top_center':alignmentStyle={
top:'0px',left:widthSign+(widthSize/2)+'px'}
;
break;
case'top_left':alignmentStyle={
top:'0px',left:'0px'}
;
break;
case'top_right':alignmentStyle={
top:'0px',left:widthSign+widthSize+'px'}
;
break;
case'bottom_center':alignmentStyle={
top:heightSign+heightSize+'px',left:widthSign+(widthSize/2)+'px'}
;
break;
case'bottom_left':alignmentStyle={
top:heightSign+heightSize+'px',left:'0px'}
;
break;
case'bottom_right':alignmentStyle={
top:heightSign+heightSize+'px',left:widthSign+widthSize+'px'}
;
break;
default:alignmentStyle={
left:'0px'}
;
break;
}
if($defined(alignmentStyle)){
this.alignmentSet=true;
this.targetEl.setStyles(alignmentStyle);
}
}
}
if(!stopEventFiring){
this.fireEvent('onshow',this);
this.fireEvent('onShowStateChange',this);
this.fireEvent('onSelected',this);
}
}
,hide:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($defined(this.triggerEl)&&$defined(this.options.hideTriggerClass)){
if($type(this.options.hideTriggerClass)==='object'){
this.triggerEl.setStyles(this.options.hideTriggerClass);
}
else{
if(this.options.hideTriggerClass!==""){
this.triggerEl.addClass(this.options.hideTriggerClass);
}
if($defined(this.options.showTriggerClass)&&($type(this.options.showTriggerClass)==='string')&&this.triggerEl.hasClass(this.options.showTriggerClass)){
this.triggerEl.removeClass(this.options.showTriggerClass);
}
}
}
this.isOpen=false;
if($defined(this.targetEl)){
if(this.options.useFx){
if($defined(this.options.fxCloseStylePre)&&(!this.inTransition)){
this.targetEl.setStyles(this.options.fxCloseStylePre);
}
this.inTransition=true;
this.fx.start(this.options.fxCloseStyle);
}
else{
if(!$defined(this.options.hideTargetClass)){
this.targetEl.setStyles({
visibility:'hidden',display:'none'}
);
}
else{
if($type(this.options.hideTargetClass)==='object'){
this.targetEl.setStyles(this.options.hideTargetClass);
}
else{
if(this.options.hideTargetClass!==""){
this.targetEl.addClass(this.options.hideTargetClass);
}
if($defined(this.options.showTargetClass)&&($type(this.options.showTargetClass)==='string')&&this.targetEl.hasClass(this.options.showTargetClass)){
this.targetEl.removeClass(this.options.showTargetClass);
}
}
}
}
}
if(!stopEventFiring){
this.fireEvent('onhide',this);
this.fireEvent('onShowStateChange',this);
}
}
,showDelay:function(timeDelay,stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($chk(timeDelay)){
this.timer=this.show.bind(this).delay(timeDelay);
}
}
,hideDelay:function(timeDelay,stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=false;
}
if($chk(timeDelay)){
this.timer=this.hide.bind(this).delay(timeDelay);
}
}
,showHandler:function(event){
if(this.options.stopPropagation===true&&$defined(event)){
event.stopPropagation();
}
if(this.options.preventDefault===true&&$defined(event)){
event.preventDefault();
}
$clear(this.timer);
if(this.isOpen===false){
if($defined(this.options.showDelay)){
this.showDelay(this.options.showDelay);
}
else{
this.show();
}
}
else if(this.options.enableTargetToggle){
if($defined(this.options.hideDelay)){
this.hideDelay(this.options.hideDelay);
}
else{
this.hide();
}
}
}
,hideHandler:function(event){
if(this.options.stopPropagation===true&&$defined(event)){
event.stopPropagation();
}
if(this.options.preventDefault===true&&$defined(event)){
event.preventDefault();
}
$clear(this.timer);
if(this.isOpen===true){
if($defined(this.options.hideDelay)){
this.hideDelay(this.options.hideDelay);
}
else{
this.hide();
}
}
}
,showHandlerTrigger:function(event){
if(this.options.stopPropagation===true&&$defined(event)){
event.stopPropagation();
}
if(this.options.preventDefault===true&&$defined(event)){
event.preventDefault();
}
$clear(this.timer);
if(this.isOpen===false){
if($defined(this.options.showDelay)){
this.showDelay(this.options.showDelay);
}
else{
this.show();
}
}
else if(this.options.enableTriggerToggle){
if($defined(this.options.hideDelay)){
this.hideDelay(this.options.hideDelay);
}
else{
this.hide();
}
}
}
,hideHandlerTrigger:function(event){
if(this.options.stopPropagation===true&&$defined(event)){
event.stopPropagation();
}
if(this.options.preventDefault===true&&$defined(event)){
event.preventDefault();
}
$clear(this.timer);
if(this.isOpen===true){
if($defined(this.options.hideDelay)){
this.hideDelay(this.options.hideDelay);
}
else{
this.hide();
}
}
}
,keypressHandlerTrigger:function(event){
this.keypressHandler(event);
}
,keypressHandler:function(event){
if($defined(event)&&$defined(event.key)){
if((this.options.stopPropagation===true)&&(event.key==='enter'||event.key==='esc')){
event.stopPropagation();
}
if((this.options.preventDefault===true)&&(event.key==='enter'||event.key==='esc')){
event.preventDefault();
}
$clear(this.timer);
switch(event.key){
case'enter':if(this.isOpen===false){
this.show();
}
break;
case'esc':if(this.isOpen===true){
this.hide();
}
break;
}
}
}
,transitionStartHandler:function(){
this.fireEvent('onTransitionStart',this);
}
,transitionCompleteHandler:function(){
if(this.isOpen){
if($defined(this.options.fxOpenStylePost)){
this.targetEl.setStyles(this.options.fxOpenStylePost);
}
}
else{
if($defined(this.options.fxCloseStylePost)){
this.targetEl.setStyles(this.options.fxCloseStylePost);
}
}
this.inTransition=false;
this.fireEvent('onTransitionComplete',this);
}
}
);
var CHKButton=new Class({
Extends:CHKControl_Base,options:{
selectEvent:'click'}
,initialize:function(control,options){
this.parent(control,options);
if($defined(this.controlEl)){
if($defined(this.options.selectEvent)){
$splat(this.options.selectEvent).each(function(event){
this.controlEl.addEvent(event,this.selectedHandler.bind(this));
}
.bind(this));
}
this.controlEl.addEvent('keypress',this.keypressHandler.bind(this));
}
this.render(false);
}
,selectFunc:$empty,keypressHandler:function(event){
if(event.key==='enter'){
this.selectedHandler(event);
}
}
,selectedHandler:function(event){
if(this.options.stopPropagation===true){
event.stopPropagation();
}
if(this.options.preventDefault===true){
event.preventDefault();
}
if(($defined(this.selectFunc))&&($type(this.selectFunc)==='function')){
this.selectFunc();
}
this.fireEvent('onSelected',this);
}
}
);
var CHKTabControl=new Class({
Extends:CHKControl_Base,options:{
tabClass:null,tabTarget:'rel',tabTargetSelector:null,display:-1,keepHistory:false,loop:false,rotationDelay:3000,rotationDirection:'forward',tabSettings:{
showEvent:'click',hideEvent:null,showTriggerClass:null,hideTriggerClass:null,showTargetClass:null,hideTargetClass:null,showDelay:null,hideDelay:null}
}
,tabs:[],history:[],totalTabs:0,currentTab:null,stopHistory:false,stopEvent:false,rotationTimer:null,initialize:function(control,options){
var tabindex,target,els,popupOptions,temppopup;
this.parent(control,options);
tabindex=0;
if($defined(this.controlEl)){
if($defined(this.options.tabClass)){
this.controlEl.getElements(this.options.tabClass).each(function(item,index){
target=null;
switch(this.options.tabTarget){
case'sibling':if($defined(this.options.tabTargetSelector)){
target=item.getNext(this.options.tabTargetSelector);
}
else{
target=item.getNext();
}
break;
case'child':els=null;
if($defined(this.options.tabTargetSelector)){
els=item.getChildren(this.options.tabTargetSelector);
if(els.length<1){
els=item.getElements(this.options.tabTargetSelector);
}
}
else{
els=item.getChildren();
}
if(($defined(els))&&(els.length>0)){
target=els[0];
}
break;
case'rel':target=$(item.get('rel'));
break;
default:target=$(item.get('rel'));
break;
}
popupOptions=this.options.tabSettings;
popupOptions.name='tab'+tabindex;
temppopup=new CHKCustomPopUp(item,target,popupOptions);
if(temppopup.isOpen===true){
this.currentTab=index;
}
this.addTab(temppopup);
}
.bind(this));
}
}
if(this.options.display>=0){
this.showTab(this.options.display);
}
this.render(false);
}
,isTabOpen:function(){
var output=false;
if($defined(this.tabs)&&this.tabs.length>0){
this.tabs.each(function(item,index){
if($defined(item.isOpen)&&item.isOpen){
output=true;
}
}
.bind(this));
}
return output;
}
,addTab:function(tab){
if($defined(tab)){
tab.addEvent('onshow',this.tabShowHandler.bind(this));
tab.addEvent('onhide',this.tabHideHandler.bind(this));
tab.addEvent('onSelected',this.selectedHandler.bind(this));
this.tabs.push(tab);
this.totalTabs++;
}
}
,back:function(){
if(($defined(this.history))&&(this.history.length>0)){
var lastIndex=this.history.getLast();
this.history.splice((this.history.length-1),1);
this.stopHistory=true;
this.showTab(lastIndex);
this.stopHistory=false;
return lastIndex;
}
return null;
}
,next:function(){
var showFlag,nextTab;
showFlag=true;
if($defined(this.currentTab)){
nextTab=this.currentTab+1;
}
else{
nextTab=0;
}
if(nextTab>=this.totalTabs){
if(this.options.loop){
nextTab=0;
}
else{
showFlag=false;
}
}
if(showFlag){
this.showTab(nextTab,false);
return nextTab;
}
return null;
}
,previous:function(){
var showFlag,nextTab;
showFlag=true;
if($defined(this.currentTab)){
nextTab=this.currentTab-1;
}
else{
nextTab=0;
}
if(nextTab<0){
if(this.options.loop){
nextTab=this.totalTabs-1;
}
else{
showFlag=false;
}
}
if(showFlag){
this.showTab(nextTab,false);
return nextTab;
}
return null;
}
,rotate:function(){
var tabIndex;
$clear(this.rotationTimer);
switch(this.options.rotationDirection){
case'backward':tabIndex=this.previous();
break;
case'forward':tabIndex=this.next();
break;
default:tabIndex=this.next();
break;
}
if($defined(tabIndex)){
if(($chk(this.options.rotationDelay))&&(this.options.rotationDelay>0)){
this.rotationTimer=this.rotate.bind(this).delay(this.options.rotationDelay);
}
}
}
,rotateStart:function(){
if(($chk(this.options.rotationDelay))&&(this.options.rotationDelay>0)){
this.rotationTimer=this.rotate.bind(this).delay(this.options.rotationDelay);
}
}
,rotateStop:function(){
$clear(this.rotationTimer);
}
,showTab:function(tabNumber,stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=true;
}
if(($chk(tabNumber))&&(tabNumber<this.tabs.length)){
if(stopEventFiring){
this.stopEvent=true;
}
this.tabs[tabNumber].show();
if(stopEventFiring){
this.stopEvent=false;
}
}
}
,hideTab:function(tabNumber,stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=true;
}
if(tabNumber<this.tabs.length){
if(stopEventFiring){
this.stopEvent=true;
}
this.tabs[tabNumber].hide();
if(stopEventFiring){
this.stopEvent=false;
}
}
}
,hideAllTabs:function(stopEventFiring){
if(!$defined(stopEventFiring)){
stopEventFiring=true;
}
if(($defined(this.tabs))&&(this.tabs.length>0)){
if(stopEventFiring){
this.stopEvent=true;
}
this.tabs.each(function(item,index){
item.hide();
}
.bind(this));
if(stopEventFiring){
this.stopEvent=false;
}
}
}
,tabShowHandler:function(popup){
var temppopup=popup;
this.tabs.each(function(item,index){
if(item.uid!==temppopup.uid){
item.hide();
}
else{
if((this.options.keepHistory)&&(!this.stopHistory)&&($chk(this.currentTab))){
this.history.push(this.currentTab);
}
this.currentTab=index;
if(!this.stopEvent){
this.fireEvent('onShowTab',index);
}
}
}
.bind(this));
}
,tabHideHandler:function(popup){
var numOpen=0;
this.tabs.each(function(item,index){
if(item.isOpen){
numOpen++;
}
if((item.uid===popup.uid)&&(!this.stopEvent)){
this.fireEvent('onHideTab',index);
}
}
.bind(this));
if((!this.stopEvent)&&(numOpen===0)){
this.fireEvent('onHideAllTab',this);
}
}
,selectedHandler:function(obj){
if(($defined(obj))&&(!this.stopEvent)){
this.fireEvent('onSelected',obj);
}
}
}
);
var CHKQueue=new Class({
Implements:[Events,Options,CHKOverrides],options:{
enforceUnique:false}
,queue:[],initialize:function(options){
this.setOptions(options);
this.setOverrides();
}
,enqueue:function(item){
var enqueueFlag=false;
if($defined(item)){
if(this.options.enforceUnique){
if(!this.queue.contains(item)){
this.queue.push(item);
enqueueFlag=true;
}
}
else{
this.queue.push(item);
enqueueFlag=true;
}
}
this.fireEvent('enqueue',{
item:item,success:enqueueFlag,obj:this}
);
}
,dequeue:function(){
var output=null,dequeueFlag=false;
if($defined(this.queue)&&this.queue.length>0){
output=this.queue.shift();
dequeueFlag=true;
}
this.fireEvent('dequeue',{
item:output,success:dequeueFlag,obj:this}
);
return output;
}
,clearQueue:function(){
if($defined(this.queue)&&this.queue.length>0){
this.queue=this.queue.empty();
this.fireEvent('clearQueue',this);
}
}
,getSize:function(){
if($defined(this.queue)&&this.queue.length>0){
return this.queue.length;
}
return 0;
}
,hasItems:function(){
if(this.getSize()>0){
return true;
}
return false;
}
,hasItem:function(obj){
var output=false;
if($defined(obj)&&$defined(this.queue)&&this.queue.length>0&&this.queue.contains(obj)){
output=true;
}
return output;
}
,removeItem:function(obj){
var output=false;
if($defined(obj)&&$defined(this.queue)&&this.queue.length>0&&this.queue.contains(obj)){
this.queue=this.queue.erase(obj);
output=true;
}
this.fireEvent('removeItem',{
item:obj,success:output,obj:this}
);
return output;
}
}
);
var CHKRequestMulti=new Class({
Implements:[Events,Options,CHKOverrides,CHKClassName],options:{
poolSize:1}
,requestObjs:null,initialize:function(options){
this.setOptions(options);
this.requestObjs=$H({
}
);
if($defined(this.options.poolSize)&&this.options.poolSize>0){
for(i=0;
i<this.options.poolSize;
i++){
var reqMultiObj=this;
this.options.uid=parseInt(i,10);
var req=new Request(this.options);
req.addEvent('onComplete',function(){
reqMultiObj.onCompleteHandler(this.options.uid);
}
);
req.addEvent('onCancel',function(){
reqMultiObj.onCancelHandler(this.options.uid);
}
);
req.addEvent('onSuccess',function(responseText,responseXML){
reqMultiObj.onSuccessHandler(responseText,responseXML,this.options.uid);
}
);
req.addEvent('onFailure',function(xhr){
reqMultiObj.onFailureHandler(xhr,this.options.uid);
}
);
req.addEvent('onException',function(headerName,value){
reqMultiObj.onExceptionHandler(headerName,value,this.options.uid);
}
);
req.addEvent('onTimeout',function(){
reqMultiObj.onTimeoutHandler(this.options.uid);
}
);
this.requestObjs.set(i,{
isOpen:true,obj:req}
);
}
}
}
,send:function(options){
if($defined(this.requestObjs)&&this.requestObjs.getLength()>0){
var req=null;
this.requestObjs.each(function(value,key){
if(!$defined(req)&&$defined(value)&&$defined(value.isOpen)&&value.isOpen===true&&$defined(value.obj)){
value.isOpen=false;
req=value.obj;
}
}
.bind(this));
if($defined(req)){
return req.send(options);
}
}
return null;
}
,isOpen:function(){
var isOpen=false;
if($defined(this.requestObjs)&&this.requestObjs.getLength()>0){
this.requestObjs.each(function(value,key){
if($defined(value)&&$defined(value.isOpen)&&value.isOpen===true){
isOpen=true;
}
}
.bind(this));
}
return isOpen;
}
,onCompleteHandler:function(id){
if($defined(this.requestObjs)&&this.requestObjs.has(id)&&$defined(this.requestObjs.get(id))){
var requestObj=this.requestObjs.get(id);
if($defined(requestObj.isOpen)){
requestObj.isOpen=true;
}
}
this.fireEvent('onComplete',[id]);
}
,onCancelHandler:function(id){
if($defined(this.requestObjs)&&this.requestObjs.has(id)&&$defined(this.requestObjs.get(id))){
var requestObj=this.requestObjs.get(id);
if($defined(requestObj.isOpen)){
requestObj.isOpen=true;
}
}
this.fireEvent('onCancel',[id]);
}
,onSuccessHandler:function(responseText,responseXML,id){
if($defined(this.requestObjs)&&this.requestObjs.has(id)&&$defined(this.requestObjs.get(id))){
var requestObj=this.requestObjs.get(id);
if($defined(requestObj.isOpen)){
requestObj.isOpen=true;
}
}
this.fireEvent('onSuccess',[responseText,responseXML,id]);
}
,onFailureHandler:function(xhr,id){
if($defined(this.requestObjs)&&this.requestObjs.has(id)&&$defined(this.requestObjs.get(id))){
var requestObj=this.requestObjs.get(id);
if($defined(requestObj.isOpen)){
requestObj.isOpen=true;
}
}
this.fireEvent('onFailure',[xhr,id]);
}
,onExceptionHandler:function(headerName,value,id){
if($defined(this.requestObjs)&&this.requestObjs.has(id)&&$defined(this.requestObjs.get(id))){
var requestObj=this.requestObjs.get(id);
if($defined(requestObj.isOpen)){
requestObj.isOpen=true;
}
}
this.fireEvent('onException',[headerName,value,id]);
}
,onTimeoutHandler:function(id){
if($defined(this.requestObjs)&&this.requestObjs.has(id)&&$defined(this.requestObjs.get(id))){
var requestObj=this.requestObjs.get(id);
if($defined(requestObj.isOpen)){
requestObj.isOpen=true;
}
}
this.fireEvent('onTimeout',[id]);
}
}
);
var CHKCoreEngine_Base=new Class({
Implements:[Events,Options,CHKOverrides,CHKClassName],results:null,resizeControl:null,toolbar:null,pagemenus:[],headerPopups:[],headerTabControls:[],pagePopups:[],pageTabControls:[],pageAccordions:[],footerPopups:[],footerTabControls:[],pageScrollBoxes:[],buttons:[],sliders:[],view:[],sorter:null,services:[],options:{
}
,initialize:function(options){
this.setOptions(options);
this.setOverrides();
this.render(false);
}
,render:function(resize){
if(!$defined(resize)){
resize=false;
}
this.fireEvent('onBeginRender',this);
if($defined(this.customRender)){
this.customRender(resize);
}
this.fireEvent('onEndRender',this);
}
,customRender:$empty,setResults:function(obj){
if($defined(obj)){
obj.addEvent('onPositionChange',this.onPositionChangeReultsHandler.bind(this));
this.results=obj;
}
}
,setResize:function(obj){
if($defined(obj)){
obj.addEvent('onResize',this.resizeHandler.bind(this));
obj.addEvent('onResizeThreshold',this.resizeHandlerThreshold.bind(this));
this.resizeControl=obj;
}
}
,setToolbar:function(obj){
if($defined(obj)){
this.toolbar=obj;
}
}
,addSlider:function(obj){
if($defined(obj)){
obj.addEvent('onChange',this.onChangeSliderHandler.bind(this));
this.sliders.push(obj);
}
}
,addView:function(obj){
if($defined(obj)){
obj.addEvent('onSelected',this.viewSelectedHandler.bind(this));
this.view.push(obj);
}
}
,addServices:function(obj){
if($defined(obj)){
obj.addEvent('getDataSuccess',this.getDataSuccessHandler.bind(this));
obj.addEvent('getDataFail',this.getDataFailHandler.bind(this));
this.services.push(obj);
}
}
,addMenu:function(obj){
if($defined(obj)){
this.pagemenus.push(obj);
}
}
,addHeaderPopup:function(obj){
if($defined(obj)){
this.headerPopups.push(obj);
}
}
,addHeaderTabControls:function(obj){
if($defined(obj)){
this.headerTabControls.push(obj);
}
}
,addPagePopup:function(obj){
if($defined(obj)){
this.pagePopups.push(obj);
}
}
,addPageTabControls:function(obj){
if($defined(obj)){
this.pageTabControls.push(obj);
}
}
,addPageScrollBox:function(obj){
if($defined(obj)){
this.pageScrollBoxes.push(obj);
}
}
,addPageAccordions:function(obj){
if($defined(obj)){
this.pageAccordions.push(obj);
}
}
,addFooterPopup:function(obj){
if($defined(obj)){
this.footerPopups.push(obj);
}
}
,addFooterTabControls:function(obj){
if($defined(obj)){
this.footerTabControls.push(obj);
}
}
,addButton:function(obj){
if($defined(obj)){
this.buttons.push(obj);
}
}
,getBroswerSize:function(){
if($defined(this.resizeControl)){
return this.resizeControl.getSize();
}
return null;
}
,viewSelectedHandler:function(obj){
if(($defined(this.results))&&($defined(obj))&&($defined(obj.options))&&($defined(obj.options.name))){
this.results.setView(obj.options.name);
if(($defined(this.pageScrollBoxes))&&(this.pageScrollBoxes.length>0)){
this.pageScrollBoxes.each(function(item,index){
item.render(false);
}
.bind(this));
}
}
}
,onChangeSliderHandler:function(data){
if(($defined(this.sliders))&&(this.sliders.length>0)){
this.sliders.each(function(slider,i){
if(slider.uid!==data.obj.uid){
slider.setPositionByPercentage(data.percentage);
}
}
.bind(this));
}
if($defined(this.results)){
this.results.setPosition(data.percentage);
}
}
,onPositionChangeReultsHandler:function(data){
if(($defined(this.sliders))&&(this.sliders.length>0)){
this.sliders.each(function(slider,i){
if(slider.uid!==data.obj.uid){
slider.setPositionByPercentage(data.percentage,true);
}
}
.bind(this));
}
}
,onChangeTabbedHandler:function(data){
if($defined(this.results)){
this.results.setPosition(data.position);
}
}
,getDataSuccessHandler:function(data){
if($defined(this.results)){
this.results.loadData(data);
}
}
,getDataFailHandler:function(data){
alert('Get Data Failure - '+JSON.encode(data));
}
,resizeHandler:function(size){
}
,resizeHandlerThreshold:function(size){
}
}
);
var PopupManager=new Class({
popups:[],add:function(popup){
this.popups.push(popup);
popup.addEvent("onshow",function(){
for(var i=0;
i<this.popups.length;
i++){
var p=this.popups[i];
if(p!=popup&&p.isOpen){
p.hide();
}
}
}
.bind(this));
return popup;
}
,addAll:function(popups){
popups.each(function(popup){
this.add(popup);
}
.bind(this))}
}
);
var PopupAccessibility=new Class({
addSimpleAccessibility:function(){
var links=this.targetEl.getElements("a");
if(links&&links.length>0){
this.addAccessibility(links[0],links[links.length-1]);
}
}
,addAccessibility:function(firstLink,lastLink){
if(firstLink){
this._addFirstLinkEvents(firstLink);
}
if(lastLink){
this._addLastLinkEvents(lastLink);
}
}
,addKeyPressHandler:function(){
this._triggerLink().addEvent("keypress",function(event){
if(event.key!='enter'||this.inTransition){
return true;
}
if(this.isOpen){
this.hide();
}
else{
this.show();
}
return true;
}
.bind(this));
}
,_addFirstLinkEvents:function(firstLink){
this.addEvent('onshow',function(){
firstLink.focus();
}
);
firstLink.addEvent('keypress',function(event){
if(event.key=='tab'&&event.shift){
this.hide();
this._triggerLink().focus();
}
}
.bind(this));
}
,_addLastLinkEvents:function(lastLink){
lastLink.addEvent('keypress',function(event){
if(event.key=='tab'&&!event.shift){
this.hide();
this._triggerLink().focus();
}
}
.bind(this));
}
,_triggerLink:function(){
return this.triggerEl.nodeName=="A"?this.triggerEl:this.triggerEl.getElement("a");
}
}
);
/*Date:2/24/2012 7:05:35 AMAll images published*/
JS代码(zzsc.js):
//163cssvar product_timer = null;
var cXML = new Array();
cXML = ['smb01','camp02','camp03','camp04',''];
var isURLcamp = false;
var src_campaign = new Array('','');
var campCk = true;
function validURL(u){
return ! (/[^a-zA-Z0-9_#]+/.test(u));
}
function removeCampFromUrl(campName,strHref){
var cleanURL = '';
if (campName[1] == '?') cleanURL = '?';
if (campName[1] == '&' && campName[3] == '&') cleanURL = '&';
window.location = strHref.replace(campName[0],cleanURL);
}
function getURLparm(){
var strHref = window.location.href;
if (strHref.indexOf("_cic_") > -1){
var campName = /(\?|&)_cic_=(\w+)(&*)/i.exec(strHref);
removeCampFromUrl(campName,strHref);
var strGlobalCampName = validURL(campName[2]);
if (campName[2] && strGlobalCampName){
for (var i = 0;
i <= cXML.length;
i++){
if (cXML[i] == campName[2]){
isURLcamp = true;
return cXML[i];
}
}
}
}
return 0;
}
var xmlFile = getURLparm();
if (isIE){
var doc_title = document.title;
}
function promo_click(){
$$('.content.basic a').addEvent('click',function(){
trackMetrics('promoClick',{
type:'link',id:this.getAttribute('name'),url:this.getAttribute('href')}
);
}
);
$$('.segment_one_banner a').addEvent('click',function(){
trackMetrics('promoClick',{
type:'link',id:this.getAttribute('name'),url:this.getAttribute('href')}
);
}
);
}
function basic_store(cont_parent){
if (cont_parent.getElement('.content') != null){
var input = cont_parent.getElement('.content').getElements('input');
if (input.length == 2){
cont_parent = input[0].getParent();
cont_parent.getElements('input')[0].dispose();
if (cont_parent.getElements('.image').length == 2) cont_parent.getElements('.image')[0].dispose();
if (cont_parent.getElements('.default_content').length == 2) cont_parent.getElements('.default_content')[0].dispose();
else cont_parent.getElements('.default_content')[0].inject(cont_parent.getElements('.image')[0],'after');
if (cont_parent.getElements('.over_content').length == 2){
if (cont_parent.getElements('.over_content .title').length == 1) cont_parent.getElements('.over_content .title')[0].inject(cont_parent.getElements('.over_content')[1].getElements('.link_list')[0],'before');
if (cont_parent.getElements('.over_content .cta').length == 1){
var name = cont_parent.getElements('.over_content .cta a')[0].getProperty('name');
name += "_shopnow";
cont_parent.getElements('.over_content .cta a')[0].setProperty('name',name);
cont_parent.getElements('.over_content .cta')[0].inject(cont_parent.getElements('.over_content')[1].getElements('.link_list')[0],'after');
$$('.over_content .link_list a').each(function(element){
var lname = element.getProperty('name');
lname += "_shopnow";
element.setProperty('name',lname);
}
);
}
else if (cont_parent.getElements('.over_content .cta').length > 1){
var name = cont_parent.getElements('.over_content .cta a')[1].getProperty('name');
name += "_shopnow";
cont_parent.getElements('.over_content .cta a')[1].setProperty('name',name);
$$('.over_content .link_list a').each(function(element){
var lname = element.getProperty('name');
lname += "_shopnow";
element.setProperty('name',lname);
}
);
}
if (cont_parent.getElements('.over_content .segment').length == 1) cont_parent.getElements('.segment')[0].inject(cont_parent.getElements('.over_content')[1]);
cont_parent.getElements('.over_content')[0].dispose();
}
cont_parent.getElements('.over_content').setStyles({
'position':'absolute','top':'34px'}
);
if (cont_parent.getElements('.over_content .cta')[0]) cont_parent.getElements('.over_content .cta')[0].setStyle('display','none');
(0);
}
}
}
function parseMetricsContent(){
$$('.group').each(function(group,gindex){
if (group.getElements('.content').length > 0){
switch (gindex){
case 0:assignMultiBannerMetricsIndexes(group,0);
break;
case 1:assignMultiBannerMetricsIndexes(group,3);
break;
case 2:assignMultiBannerMetricsIndexes(group,6);
break;
}
}
else if (group.getElements('.segment_one_banner').length > 0){
switch (gindex){
case 0:assignSingleBannerMetricsIndexes(group,"123");
break;
case 1:assignSingleBannerMetricsIndexes(group,"456");
break;
case 2:assignSingleBannerMetricsIndexes(group,"789");
break;
}
}
}
);
}
function assignSingleBannerMetricsIndexes(banner_group,position){
banner_group.getElements('.segment_one_banner .over_content .link_list a').each(function(link_list){
var re = new RegExp("_l\\d+");
var m = re.exec(link_list.getAttribute('name'));
if (m != null){
link_list.setAttribute('name',link_list.getAttribute('name').replace(m,'_l' + position));
}
}
);
banner_group.getElements('.segment_one_banner .cta .button a').each(function(cta){
var re = new RegExp("_l\\d+");
var m = re.exec(cta.getAttribute('name'));
if (m != null){
cta.setAttribute('name',cta.getAttribute('name').replace(m,'_l' + position));
}
}
);
banner_group.getElements('.segment_one_banner .tagline_cta a').each(function(tagline){
var re = new RegExp("_l\\d+");
var m = re.exec(tagline.getAttribute('name'));
if (m != null){
tagline.setAttribute('name',tagline.getAttribute('name').replace(m,'_l' + position));
}
}
);
banner_group.getElements('.segment_one_banner .image_url').each(function(img_url){
var re = new RegExp("_l\\d+");
var m = re.exec(img_url.getAttribute('name'));
if (m != null){
img_url.setAttribute('name',img_url.getAttribute('name').replace(m,'_l' + position));
}
}
);
}
function assignMultiBannerMetricsIndexes(banner_group,pointer){
banner_group.getElements('.content').each(function(banner,index){
banner.getElements('.over_content').each(function(o_content){
o_content.getElements('.link_list a').each(function(link_list){
var re = new RegExp("_l\\d+");
var m = re.exec(link_list.getAttribute('name'));
if (m != null){
link_list.setAttribute('name',link_list.getAttribute('name').replace(m,'_l' + (pointer + index + 1)));
}
}
);
o_content.getElements('.cta .button a').each(function(cta){
var re = new RegExp("_l\\d+");
var m = re.exec(cta.getAttribute('name'));
if (m != null){
cta.setAttribute('name',cta.getAttribute('name').replace(m,'_l' + (pointer + index + 1)));
}
}
);
}
);
}
);
}
function correctBannerImageClasses(rtl_flag){
if (!rtl_flag) return;
if ($$('.segment_one_banner').length > 0){
var images = $$('.banner .content').getFirst('.image').getElement('img').slice(0,9);
images[0].set('class',images[2].get('class'));
images[2].removeProperties('class');
images[3].set('class',images[5].get('class'));
images[5].removeProperties('class');
}
else{
var images = $$('.banner .content').getFirst('.image').getElement('img').slice(0,9);
images[0].set('class',images[2].get('class'));
images[2].removeProperties('class');
images[3].set('class',images[5].get('class'));
images[5].removeProperties('class');
images[6].set('class',images[8].get('class'));
images[8].removeProperties('class');
}
}
function addHomeCarousel(){
correctBannerImageClasses(rtl);
initHomeCarousel(rtl,'promo_area','.banner');
var els = $$('#promo_area .banner .content');
els.each(function(el){
el.addEvent('click',function(event){
if (event.target && event.target.nodeName.toLowerCase() == 'a') return;
var element = el.getElement('.over_content .cta a');
new Event(event).stop();
if (document.createEventObject){
element.click();
}
else{
var event = element.ownerDocument.createEvent('MouseEvents');
event.initMouseEvent('click',true,true,element.ownerDocument.defaultView,1,0,0,0,0,false,false,false,false,0,null);
element.dispatchEvent(event);
}
location.href = element.href;
}
);
}
);
(function(){
if ($$('.banner')[rtl ? 2:0].getElements('.banner .segment_one_banner').length <= 0){
var group = rtl ? 2:0;
$$('.banner')[group].getElements('.content .image img').each(function(image){
var title = image.get('title');
if (title){
image.set('src',title);
image.removeProperties('title');
image.setProperty('alt','');
}
}
);
var elements = $$('.banner')[group].getElements('.content .image ' + (isIE && !isIE9 ? '.ie_image':'g'));
elements.each(function(image){
var rel;
if (isIE && !isIE9){
image = image.firstChild;
rel = image['rel'];
if (rel){
image['src'] = rel;
}
}
else{
image = image.getFirst().getNext();
rel = image.get('rel');
if (rel){
image.set('href',rel);
image.removeProperties('rel');
}
}
}
)}
}
).delay(100);
var eventHandler;
eventHandler = function(){
var group = 1;
var groupLimit = 1;
if ($('promo_area').getElements('.banner .segment_one_banner').length > 0){
var takeoverBanners = $$('#promo_area .banner .segment_one_banner');
takeoverBanners.each(function(takeover){
takeover.addEvent('mouseenter',function(event){
if (!$defined(takeover.getElement('.image_url')) && !$defined(takeover.getElement('.over_content .cta a'))){
takeover.getElement('.to_container').removeClass('hand');
}
}
);
takeover.addEvent('click',function(event){
var target = event.target ? event.target:event.srcElement;
if (target.nodeType == 3){
target = target.parentNode;
}
if (target && target.nodeName.toLowerCase() == 'a'){
return;
}
else if (target && target.nodeName.toLowerCase() == 'span'){
try{
if (target.getParent('div.button')){
return;
}
}
catch(e){
return;
}
}
var element;
if ($defined(takeover.getElement('.image_url'))){
element = takeover.getElement('.image_url');
}
else if ($defined(takeover.getElement('.over_content .cta a'))){
element = takeover.getElement('.over_content .cta a');
}
else{
element = takeover.getElement('.js_banner_sobanner_tabindex');
}
new Event(event).stop();
if (document.createEventObject){
element.click();
}
else{
var event = element.ownerDocument.createEvent('MouseEvents');
event.initMouseEvent('click',true,true,element.ownerDocument.defaultView,1,0,0,0,0,false,false,false,false,0,null);
element.dispatchEvent(event);
}
location.href = element.href;
}
);
}
);
group = (rtl) ? 2:0;
groupLimit = 2;
}
for (var i = 0;
i <= groupLimit;
i++){
$$('.banner')[group].getElements('.content .image img').each(function(image){
var title = image.get('title');
if (title){
image.set('src',title);
image.removeProperties('title');
image.setProperty('alt','');
}
}
);
$$('.banner')[group].getElements('.segment_one_banner .image img').each(function(image){
var title = image.get('title');
if (title){
image.set('src',title);
image.removeProperties('title');
image.setProperty('alt','');
}
}
);
var elements = $$('.banner')[group].getElements('.content .image ' + (isIE && !isIE9 ? '.ie_image':'g'));
elements.each(function(image){
var rel;
if (isIE && !isIE9){
image = image.firstChild;
rel = image['rel'];
if (rel){
image['src'] = rel;
}
}
else{
image = image.getFirst().getNext();
rel = image.get('rel');
if (rel){
image.set('href',rel);
image.removeProperties('rel');
}
}
}
);
if (rtl){
group--;
}
else{
group++;
}
}
this.removeEvent('mouseover',eventHandler);
this.removeEvent('focus',eventHandler);
}
;
$('everything').addEvents({
'mouseover':eventHandler}
);
$$('.js_banner_tabindex')[0].addEvents({
'focus':eventHandler}
);
var carouselGroup = $$('.carousel_group');
if (rtl){
carouselGroup = carouselGroup.reverse();
}
carouselGroup[0].getElements('.carousel_box')[0].setProperty('title',$(segmentOrder[0].toLowerCase() + '_msg').getProperty('title'));
carouselGroup[1].getElements('.carousel_box')[0].setProperty('title',$(segmentOrder[1].toLowerCase() + '_msg').getProperty('title'));
carouselGroup[2].getElements('.carousel_box')[0].setProperty('title',$(segmentOrder[2].toLowerCase() + '_msg').getProperty('title'));
}
var NewsRoomTicker ={
//rss:newsroom_rss,pause:5000,chg_speed:1000,news_items:[],curr_item:0,chg_timer:null,moofx:null,mouseover:false,ticker_div:null,ticker_content_div:null,ticker_size_test_div:null,init:function(rss_url){
this.ticker_div = $('newsroom_ticker');
if (this.ticker_div == null) return false;
this.ticker_content_div = $('newsroom_ticker_content');
if (this.ticker_content_div == null){
this.hide();
return false;
}
this.rss = rss_url;
var _this = this;
var req = new Request({
method:'get',url:_this.rss,onFailure:function(err){
_this.hide();
}
,onException:function(err){
_this.hide();
}
,onComplete:function(response,responseXML){
_this.loadFeed(responseXML);
}
}
).send();
}
,init_oldpressroom_feeds:function(){
this.ticker_div = $('newsroom_ticker');
if (this.ticker_div == null) return false;
this.ticker_content_div = $('newsroom_ticker_content');
if (this.ticker_content_div == null){
this.hide();
return false;
}
if (typeof(window["sFeed_news"]) != "undefined"){
if (window.DOMParser){
xmlDoc = (new DOMParser()).parseFromString(sFeed_news,"text/xml");
}
else if (window.ActiveXObject){
try{
xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
xmlDoc.loadXML(sFeed_news);
}
catch(e){
try{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.loadXML(sFeed_news);
}
catch(E){
xmlDoc = null;
}
}
}
if (xmlDoc) tickerItems = xmlDoc.getElementsByTagName("item");
else return;
for (var i = 0;
i < tickerItems.length;
i++){
this.news_items[i] = new Array();
this.news_items[i].title = this.fix_item_size(tickerItems[i].getElementsByTagName('title')[0].firstChild.nodeValue);
this.news_items[i].url = tickerItems[i].getElementsByTagName('link')[0].firstChild.nodeValue;
}
var newsLength = tickerItems.length;
}
if (typeof(window["sFeed_feature"]) != "undefined"){
if (window.DOMParser){
xmlDoc = (new DOMParser()).parseFromString(sFeed_feature,"text/xml");
}
else if (window.ActiveXObject){
try{
xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
xmlDoc.loadXML(sFeed_feature);
}
catch(e){
try{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.loadXML(sFeed_feature);
}
catch(E){
xmlDoc = null;
}
}
}
if (xmlDoc) tickerItems = xmlDoc.getElementsByTagName("item");
else return;
var j = 0;
for (var i = 0;
i < tickerItems.length;
i++){
j = i + newsLength;
this.news_items[j] = new Array();
this.news_items[j].title = this.fix_item_size(tickerItems[i].getElementsByTagName('title')[0].firstChild.nodeValue);
this.news_items[j].url = tickerItems[i].getElementsByTagName('link')[0].firstChild.nodeValue;
}
}
this.startticker();
}
,loadFeed:function(rss_xml){
if (rss_xml){
var rss_items = rss_xml.getElementsByTagName("item");
for (var i = 0;
i < rss_items.length;
i++){
this.news_items[i] = new Array();
if (rss_items[i].getElementsByTagName('title')[0].firstChild != null && rss_items[i].getElementsByTagName('link')[0].firstChild != null){
this.news_items[i].title = this.fix_item_size(rss_items[i].getElementsByTagName('title')[0].firstChild.nodeValue);
if (rss_items[i].getElementsByTagName('link')[0].firstChild.nodeValue.substr(0,7) == "http://"){
this.news_items[i].url = rss_items[i].getElementsByTagName('link')[0].firstChild.nodeValue;
}
else{
this.news_items[i].url = hpAbsDir + 'hp-news/' + rss_items[i].getElementsByTagName('link')[0].firstChild.nodeValue;
}
}
}
this.startticker();
}
else{
return false;
}
}
,startticker:function(){
if (this.news_items.length == 0){
this.hide();
return true;
}
var tmp_html = "<a href=\"" + this.news_items[0].url + "\" onmouseover=\"NewsRoomTicker.mouseover = true;
\" onmouseout=\"NewsRoomTicker.mouseover = false;
\" style=\"color:#ffffff\" tabindex=\"201\">";
tmp_html += this.news_items[0].title + "</a>";
$('newsroom_ticker_content').innerHTML = tmp_html;
if (this.news_items.legth == 1) return;
this.moofx = new Fx.Morph(this.ticker_content_div,{
duration:500}
);
this.chg_timer = setTimeout('NewsRoomTicker.changeItem()',this.pause);
return true;
}
,changeItem:function(){
if (!this.mouseover){
this.curr_item++;
if (this.curr_item == this.news_items.length) this.curr_item = 0;
var _this = this;
this.moofx.start({
}
).chain(function(){
this.start.delay(_this.chg_speed,this,{
'opacity':0}
);
}
).chain(function(){
var tmp_html = "<a href=\"" + _this.news_items[_this.curr_item].url + "\" onmouseover=\"NewsRoomTicker.mouseover = true;
\" onmouseout=\"NewsRoomTicker.mouseover = false;
\" onfocus=\"NewsRoomTicker.mouseover = true;
\" onblur=\"NewsRoomTicker.mouseover = false;
\" style=\"color:#ffffff\" tabindex=\"201\">";
tmp_html += _this.news_items[_this.curr_item].title + "</a>";
$('newsroom_ticker_content').innerHTML = tmp_html;
this.start.delay(0001,this,{
'opacity':1}
);
}
);
}
this.chg_timer = setTimeout('NewsRoomTicker.changeItem()',this.pause);
}
,hide:function(){
this.ticker_div = $('newsroom_ticker');
if (this.ticker_div != null){
}
}
,show:function(){
this.ticker_div = $('newsroom_ticker');
if (this.ticker_div != null){
this.ticker_div.setStyles({
display:'block'}
);
}
}
,fix_item_size:function(test_text){
if (($('newsroom_ticker') != null) && ($('newsroom_ticker_left') != null) && ($('newsroom_ticker_right') != null) && ($('newsroom_ticker_header') != null) && ($('newsroom_ticker_pipe') != null)){
var max_size = ($('newsroom_ticker').clientWidth) - ($('newsroom_ticker_left').clientWidth) - ($('newsroom_ticker_right').clientWidth) - ($('newsroom_ticker_header').clientWidth) - ($('newsroom_ticker_pipe').clientWidth) - 35;
this.ticker_size_test_div = $('newsroom_ticker_size_test');
if (this.ticker_size_test_div != null){
this.ticker_size_test_div.innerHTML = test_text;
if (this.ticker_size_test_div.clientWidth > max_size){
test_text = test_text.substring(0,test_text.length - 1) + "...";
this.ticker_size_test_div.innerHTML = test_text;
if (this.ticker_size_test_div.clientWidth > max_size){
var i = test_text.length;
while (i > 0){
test_text = test_text.substring(0,test_text.length - 4) + "...";
this.ticker_size_test_div.innerHTML = test_text;
if (this.ticker_size_test_div.clientWidth <= max_size){
break;
}
;
i--;
}
}
}
}
}
else{
test_text = test_text.substr(0,76)}
return test_text;
}
}
;
var hp_cookie_path = '/';
var hp_cookie_expiration = 90;
var hp_cookie_domain = '.hp.com';
var hmpg_segments = new Array();
var customerSegment;
var hmpg_expacc = new Array();
var default_expacc = 0;
var homeReady = false;
$('carousel').addClass('hidden');
var _Ck_ = new _CK_(hp_cookie_expiration,hp_cookie_path,hp_cookie_domain);
function setCk(_name,_value,_duration,_path,_domain){
_Ck_.set(_name,_value,_duration,hp_cookie_path,hp_cookie_domain);
}
function getCk(_name){
_Ck_.get(_name);
}
function _CK_(_duration,_path,_domain){
this.domain = _domain;
this.duration = _duration;
this.path = _path;
this.exist = function(_n){
var sM = document.cookie.match(new RegExp("(" + _n + "=[^;
]*)(;
|$)"));
return sM ? unescape(sM[1]):null;
}
this.get = function(_n){
var sR = document.cookie.match(_n + '=(.*?)(;
|$)');
return sR ? unescape(sR[1]):null;
}
this.set = function(_name,_value,_duration,_path,_domain,_secure){
var duration = (_duration) ? _duration:this.duration;
var path = (_path) ? _path:this.path;
var domain = (_domain) ? _domain:this.domain;
if (duration){
var date = new Date();
date.setTime(date.getTime() + (duration * 24 * 60 * 60 * 1000));
var dExpires = date.toGMTString();
}
document.cookie = _name + "=" + escape(_value) + ";
expires=" + dExpires + ((domain) ? ";
domain=" + domain:"") + ((path) ? ";
path=" + path:"")}
;
this.del = function(_name,_domain){
var domain = (_domain) ? _domain:this.domain;
var date = new Date();
date.setFullYear(date.getYear() - 1);
document.cookie = _name + "=;
expires=" + date.toGMTString() + ((domain) ? ";
domain=" + domain:"") + ((this.path) ? ";
path=" + this.path:"/");
}
}
function cValidDate(cdate){
var camp_date = cdate.split('-');
var myDate = new Date();
myDate.setFullYear(parseInt(camp_date[0]),parseInt(camp_date[1] - 1),parseInt(camp_date[2]));
var today = new Date();
var diff = myDate - today;
diff = Math.round(diff / (1000 * 60 * 60 * 24));
if (diff > 60) diff = 60;
if (myDate > today) return diff;
else return 0;
}
function getCampCk(){
var cmpName = _Ck_.get('hp_campaign');
if (cmpName) return cmpName;
else return 0;
}
function geturlparam(name){
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)");
var results = regex.exec(window.location.href);
return results ? results[1]:"";
}
var loadCampaign = new Class({
isUrl:null,implements:[Selectors],initialize:function(xmlSrc,isUrl){
var me = this;
this.isUrl = isUrl;
var campURL = "homepage/includes/xml/hpcamp_" + xmlSrc + ".xml";
try{
new Request({
method:'get',url:campURL,onException:function(err){
}
,onSuccess:function(responseText,responseXML){
var responseHTML = new Element('div');
responseHTML.set('html',responseText);
me.placeCampaign(responseHTML,responseXML,me.isUrl,xmlSrc);
}
,onFailure:function(xhr){
}
}
).send();
}
catch(e){
}
}
,placeCampaign:function(responseHTML,responseXML,isUrl,source){
var c_isact = responseXML.getElementsByTagName('isact')[0].firstChild.nodeValue;
var c_enddate = responseXML.getElementsByTagName('enddate')[0].firstChild.nodeValue;
var cDays = cValidDate(c_enddate);
if (c_isact == 'true' && cDays){
var tempHTML = responseHTML.getElementsByTagName('div')[0].innerHTML;
var segment = responseXML.getElementsByTagName('segment')[0].firstChild.nodeValue;
var groups = $$('.group');
var firstBanner;
if (isUrl){
firstBanner = rtl ? 2:0;
}
else{
firstBanner = segmentOrder.indexOf(segment.toUpperCase());
}
var groupChildren = groups[firstBanner].getChildren();
var lastImage = rtl ? 0:2;
groupChildren[lastImage].set('html',groupChildren[1].get('html'));
groupChildren[lastImage].getElements('img')[0].removeClass('js_masked_image');
this.initHomeCarousel(groupChildren[1],tempHTML,firstBanner,(isUrl == 1 ? 1:null));
groupChildren[1].addEvent('click',function(e){
Cookie.write('hp_campaign',source,{
duration:cDays,domain:hp_cookie_domain,path:hp_cookie_path}
);
}
);
}
else{
_Ck_.set('hp_campaign',"false");
_Ck_.del('hp_campaign');
}
}
,initHomeCarousel:function(secondImage,tempHTML,i,reset){
var containerEl = secondImage.getElement('.image');
var imageEl = containerEl.getFirst();
containerEl.empty();
var image = new Element('img');
image.set({
src:imageEl.get('rel'),width:642,height:394}
);
containerEl.adopt(image);
secondImage.set('html',tempHTML);
secondImage.getElements('.image img').each(function(el){
var src = el.get('title');
if (src){
el.set('src',src);
el.removeProperty('title');
}
initMaskedImages(el,{
width:642,height:394,startIndex:100}
);
}
);
addHomeCarousel();
imageMenuContainer[i].updateMapArea(secondImage).reset(reset);
}
}
);
function reverseBannerOrder(groups){
for (var i = 0;
i <= 2;
i++){
if ($defined(groups[i].getElements('.first')[0])){
var tempHTML = groups[i].getElements('.first')[0].get('html');
groups[i].getElements('.first')[0].set('html',groups[i].getElements('.last')[0].get('html'));
groups[i].getElements('.last')[0].set('html',tempHTML);
}
}
}
function copyContent(groups){
var hope_msg = false;
if ($defined($('hope_msg'))){
hope_msg = true;
}
switch (window.customerSegment.toUpperCase()){
case "HHO":basic_store($('hho_msg'));
groups[0].set('html',$$('#hho_msg').get('html'));
groups[1].set('html',$$('#smb_msg').get('html'));
groups[2].set('html',$$('#leb_msg').get('html'));
segmentOrder = ['HHO','SMB','LEB'];
if ($('hho_msg').getElements('.segment_one_banner').length > 0 && !hope_msg){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
break;
case "SMB":basic_store($('smb_msg'));
groups[0].set('html',$$('#smb_msg').get('html'));
groups[1].set('html',$$('#hho_msg').get('html'));
groups[2].set('html',$$('#leb_msg').get('html'));
segmentOrder = ['SMB','HHO','LEB'];
if ($('smb_msg').getElements('.segment_one_banner').length > 0 && !hope_msg){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
break;
case "LEB":basic_store($('leb_msg'));
groups[0].set('html',$$('#leb_msg').get('html'));
groups[1].set('html',$$('#hho_msg').get('html'));
groups[2].set('html',$$('#smb_msg').get('html'));
segmentOrder = ['LEB','HHO','SMB'];
if ($('leb_msg').getElements('.segment_one_banner').length > 0 && !hope_msg){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
break;
case "GA":basic_store($('ga_msg'));
groups[0].set('html',$$('#ga_msg').get('html'));
groups[1].set('html',$$('#hho_msg').get('html'));
groups[2].set('html',$$('#smb_msg').get('html'));
segmentOrder = ['GA','HHO','SMB'];
if ($('ga_msg').getElements('.segment_one_banner').length > 0 && !hope_msg){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
break;
case "GHE":basic_store($('ghe_msg'));
groups[0].set('html',$$('#ghe_msg').get('html'));
groups[1].set('html',$$('#hho_msg').get('html'));
groups[2].set('html',$$('#smb_msg').get('html'));
segmentOrder = ['GHE','HHO','SMB'];
if ($('ghe_msg').getElements('.segment_one_banner').length > 0 && !hope_msg){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
break;
default:basic_store($('hho_msg'));
groups[0].set('html',$$('#hho_msg').get('html'));
groups[1].set('html',$$('#smb_msg').get('html'));
groups[2].set('html',$$('#leb_msg').get('html'));
segmentOrder = ['HHO','SMB','LEB'];
if ($('hho_msg').getElements('.segment_one_banner').length > 0 && !hope_msg){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
break;
}
}
if (isIE7 || isIE8){
var segment = (window.defaultSegment) ? window.defaultSegment:'HHO';
customerSegment = Cookie.read("hp_cust_seg_sel");
if ($defined(window.customerSegment)){
segment = window.customerSegment;
}
else{
segment = (window.defaultSegment) ? window.defaultSegment:'HHO';
}
$$('#' + segment.toLowerCase() + '_msg .content .image img').each(function(image){
image.setProperty('src',image.getProperty('title'));
}
);
}
window.addEvent((isIE && !isIE9) ? 'load':'domready',function(){
if (typeof(window["sFeed_news"]) != "undefined"){
NewsRoomTicker.init_oldpressroom_feeds();
}
else{
NewsRoomTicker.hide();
}
if (Cookie.read("hp_cust_seg_sel") == null){
customerSegment = (window.defaultSegment) ? window.defaultSegment:'HHO';
}
else{
if (Cookie.read("hp_cust_seg_sel") == undefined){
customerSegment = (window.defaultSegment) ? window.defaultSegment:'HHO';
}
else{
customerSegment = Cookie.read("hp_cust_seg_sel");
}
}
homeReady = true;
segmentOrder = [];
var groups = $$('.group');
var hope_msg = document.getElementById('hope_msg');
if (rtl){
groups = groups.reverse();
}
if ($defined(window.customerSegment)){
copyContent(groups);
}
else{
basic_store($('hho_msg'));
groups[0].set('html',$$('#hho_msg').get('html'));
groups[1].set('html',$$('#smb_msg').get('html'));
groups[2].set('html',$$('#leb_msg').get('html'));
segmentOrder = ['HHO','SMB','LEB'];
if ($('hho_msg').getElements('.segment_one_banner').length > 0 && hope_msg == null){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
}
if (hope_msg != null){
basic_store($('hope_msg'));
groups[2].set('html',groups[1].get('html'));
groups[1].set('html',groups[0].get('html'));
groups[0].set('html',$$('#hope_msg').get('html'));
segmentOrder = ['HOPE',segmentOrder[0],segmentOrder[1]];
if ($('hope_msg').getElements('.segment_one_banner').length > 0){
groups[0].getElements('.content').destroy();
groups[0].getElements('.segment_one_banner').getElement('img').setProperty('src',groups[0].getElements('.segment_one_banner').getElement('img').getProperty('title'));
groups[0].getElements('.segment_one_banner').getElement('img').removeProperty('title');
}
}
if (rtl){
reverseBannerOrder(groups);
}
parseMetricsContent();
campCk = getCampCk();
if (isURLcamp){
new loadCampaign(xmlFile,1);
}
else if (campCk){
new loadCampaign(campCk,0);
}
else{
addHomeCarousel();
}
promo_click();
rtlPatch();
}
);
function trackLoadMetrics(msg1,msg2,msg3,index){
try{
var pattern = /_l\d+_/;
if (!rtl){
trackMetrics("promoClosedImpression",{
messages:[msg1.replace(pattern,"_l" + (index * 3 + 1) + "_"),msg2.replace(pattern,"_l" + (index * 3 + 2) + "_"),msg3.replace(pattern,"_l" + (index * 3 + 3) + "_")]}
);
}
else{
trackMetrics("promoClosedImpression",{
messages:[msg3.replace(pattern,"_l" + (index * 3 + 3) + "_"),msg2.replace(pattern,"_l" + (index * 3 + 2) + "_"),msg1.replace(pattern,"_l" + (index * 3 + 1) + "_")]}
);
}
}
catch(err){
}
}
function trackLoadMetricsSOB(msg1,index){
try{
var pattern = /_l\d+_/;
switch (index){
case 0:trackMetrics("promoClosedImpression",{
messages:[msg1.replace(pattern,"_l" + "123" + "_")]}
);
break;
case 1:trackMetrics("promoClosedImpression",{
messages:[msg1.replace(pattern,"_l" + "456" + "_")]}
);
break;
case 2:trackMetrics("promoClosedImpression",{
messages:[msg1.replace(pattern,"_l" + "789" + "_")]}
);
break;
}
}
catch(err){
}
}
window.addEvent('domready',function(){
var segment = getSegmentCK();
if ((navigator.appVersion.indexOf("MSIE") > 0)){
(function(){
var elements = $$('#' + segment + ' .content');
try{
if ($$('#' + segment + ' .segment_one_banner').length > 0){
elements = $$('#' + segment + ' .segment_one_banner');
if (elements[0].getElements('.image_url').length > 0){
trackLoadMetricsSOB(elements[0].getElement('.image_url').getAttribute('name'),rtl ? 2:0);
}
else{
trackLoadMetricsSOB(elements[0].getElement('.over_content .cta .button a').getAttribute('name'),rtl ? 2:0);
}
}
else{
trackLoadMetrics(elements[rtl ? 2:0].getElement('.over_content .cta .button a').getAttribute('name'),elements[1].getElement('.over_content .cta .button a').getAttribute('name'),elements[rtl ? 2:0].getElement('.over_content .cta .button a').getAttribute('name'),rtl ? 2:0);
}
}
catch(e){
}
}
).delay(1);
}
}
);
function getSegmentCK(){
var mapping ={
"HHO":'hho_msg',"SMB":'smb_msg',"LEB":'leb_msg',"GA":'ga_msg',"GHE":'ghe_msg'}
;
if ($defined($('hope_msg'))){
return 'hope_msg';
}
else{
var maptxt = ((window.defaultSegment) ? window.defaultSegment:"HHO").toLowerCase() + "_msg";
var segmentMapping = (Cookie.read("hp_cust_seg_sel")) ? Cookie.read("hp_cust_seg_sel"):(window.defaultSegment) ? window.defaultSegment:"HHO";
return mapping[segmentMapping.toUpperCase()] || maptxt;
}
}
window.addEvent('load',function(){
var segment = getSegmentCK();
if ($(segment).getElement('.first') != null){
var input = $(segment).getElement('.first').getElements('input');
if (input.length == 1 && input[0].value.toUpperCase() != "store".toUpperCase() && $(segment).getElements('.segment_one_banner').length <= 0){
//initMainNav($('js_main_nav'),true,5000);
}
else{
//initMainNav($('js_main_nav'),false,0);
}
}
else{
initMainNav($('js_main_nav'),false,0);
}
if (! (navigator.appVersion.indexOf("MSIE") > 0)){
var elements = $$('#' + segment + ' .content');
if ($$('#' + segment + ' .content')[0] != null){
trackLoadMetrics(elements[rtl ? 2:0].getElement('.over_content .cta .button a').getAttribute('name'),elements[1].getElement('.over_content .cta .button a').getAttribute('name'),elements[rtl ? 0:2].getElement('.over_content .cta .button a').getAttribute('name'),rtl ? 2:0);
}
else if ($$('#' + segment + ' .segment_one_banner').length > 0){
elements = $$('#' + segment + ' .segment_one_banner');
if (elements[0].getElements('.image_url').length > 0){
trackLoadMetricsSOB(elements[0].getElement('.image_url').getAttribute('name'),rtl ? 2:0);
}
else{
trackLoadMetricsSOB(elements[0].getElement('.over_content .cta .button a').getAttribute('name'),rtl ? 2:0);
}
}
}
}
);
var JSCanvas ={
_svgNS:'http://www.w3.org/2000/svg',_xlinkNS:'http://www.w3.org/1999/xlink',createCanvas:function(attributes){
var node;
if (isIE && !isIE9){
if (!document.namespaces['v']){
document.namespaces.add('v','urn:schemas-microsoft-com:vml');
var ruleNames = ['polyline','fill'];
ruleNames.each(function(ruleName){
document.createStyleSheet().addRule('v\\:' + ruleName,'behavior:url(#default#VML);
display:inline-block;
');
}
);
}
JSCanvas.create = JSCanvas._createVML;
node = JSCanvas.create('div',attributes);
}
else{
JSCanvas.create = JSCanvas._createSVG;
node = JSCanvas.create('svg',attributes);
}
return node;
}
,_createVML:function(name,attributes){
var node = document.createElement(name != 'div' ? 'v:' + name:name);
node.append = JSCanvas._append;
node.attr = JSCanvas._attrVML;
if (typeof attributes == 'object'){
node.attr(attributes);
}
return node;
}
,_attrVML:function(attribute,value){
if (typeof attribute == 'object'){
for (key in attribute){
if (key == 'style'){
var styles = attribute[key];
for (var style in styles){
this.style[style] = styles[style];
}
}
else{
this[key] = attribute[key];
}
}
}
else if (typeof(attribute) == 'string'){
if (typeof value != 'undefined'){
this[attribute] = value;
}
else{
return this.getAttribute(attribute);
}
}
}
,_createSVG:function(name,attributes){
var node = document.createElementNS(JSCanvas._svgNS,name);
if (name == 'svg'){
node.setAttribute('version','1.1')}
node.append = JSCanvas._append;
node.attr = JSCanvas._attrSVG;
if (typeof attributes == 'object'){
node.attr(attributes);
}
return node;
}
,_attrSVG:function(attribute,value){
if (typeof attribute == 'object'){
for (var key in attribute){
if (key == 'href'){
this.setAttributeNS(JSCanvas._xlinkNS,'href',attribute[key]);
}
else{
this.setAttribute(key,attribute[key]);
}
}
}
else if (typeof(attribute) == 'string'){
if (typeof value != 'undefined'){
if (attribute == 'href'){
this.setAttributeNS(JSCanvas._xlinkNS,attribute,value);
}
else{
this.setAttribute(attribute,value);
}
}
else{
return this.getAttribute(attribute);
}
}
}
,_append:function(child,attributes){
if (typeof child == 'string'){
var new_child = JSCanvas.create(child,attributes);
this.append(new_child);
return new_child;
}
else{
this.appendChild(child);
}
}
}
;
function filter(array,func){
var filtered = [],rest = [];
for (var i = array.length - 1;
i >= 0;
i--){
if (func(array[i],i,array)){
filtered.push(array[i])}
else{
rest.push(array[i])}
}
return{
filtered:filtered,rest:rest}
;
}
var BannerTabIndexHelper ={
controlLinksClass:"js_banner_tabindex",initialize:function(options){
this.setOptions(options);
}
,cleanUpTabIndexes:function(links){
this.filterControlLinks(links).rest.each(this.hideTabIndexes);
}
,hideTabIndexes:function(a){
a.set("tabindex",-1);
}
,condition:function(el){
return $(el).hasClass(this.controlLinksClass)}
,filterControlLinks:function(links){
return filter(links,this.condition.bind(this))}
}
;
var MaskedImage = new Class({
Implements:Options,initialize:function(targetEl,index,options){
if (!targetEl){
return;
}
this.setOptions(options ||{
}
);
var width = this.options.width,height = this.options.height;
var styleClass = this.options.styleClass || '';
styleClass += (targetEl.styleclass ? ' ' + targetEl.styleclass:'');
var styles = (isIE && !isIE9) ?{
width:width + 'px',height:height + 'px',overflow:'hidden'}
:'width:' + width + 'px;
height:' + height + 'px;
';
if (isIE8) styles.direction = 'ltr';
var canvas = JSCanvas.createCanvas({
'style':styles,'className':styleClass,rel:targetEl.src || targetEl.title,focusable:false}
);
if (isIE && !isIE9){
var group = canvas.append('group',{
onclick:function(e){
new Event(e).stop();
canvas.click();
}
}
);
var shape = group.append('polyline',{
className:'ie_image',points:this.options.points,fillColor:'#000000',stroked:false,style:{
position:'absolute',top:'-1px',right:'0px'}
}
);
shape.append('fill',{
src:targetEl.src,rel:targetEl.title,type:'frame'}
);
shape = group.append('polyline',{
points:this.options.points,fillColor:'#000000',stroked:false,style:{
position:'absolute',top:'-1px',visibility:'hidden'}
}
);
shape.append('fill',{
color:'#000000',opacity:(1 - this.options.filterOpacity)}
);
}
else{
var g = canvas.append('g');
var clip = g.append('clipPath',{
id:'CP',tabindex:-1}
);
clip.append('polyline',{
points:this.options.points,fill:'#000000',style:'stroke-width:0'}
);
g.append('image',{
'href':targetEl.src,'rel':targetEl.title,width:width,height:height,'clip-path':'url(#CP)',tabindex:-1}
);
g.append('polyline',{
points:this.options.points,style:'stroke-width:0;
fill:#000000;
fill-opacity:' + (1 - this.options.filterOpacity) + ';
visibility:hidden;
'}
);
}
var mapName = this.options.mapName + index;
var map = new Element('div');
map.set({
html:'<map name="' + mapName + '"><area shape="poly" coords="' + this.options.mapPoints.split(' ').join(',') + '"></area></map>'}
);
map = map.getFirst();
var shadow = new Element('img');
shadow.set({
src:this.options.shadowImg,usemap:'#' + mapName,tabindex:-1}
);
if (isIE6){
shadow.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=0)';
var div = new Element('div',{
style:"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.options.shadowImg + "');
",'class':this.options.shadowClass}
);
div.adopt(shadow);
shadow = div;
}
else{
shadow.className = this.options.shadowClass;
}
var parentEl = targetEl.getParent();
parentEl.adopt([shadow,map]);
parentEl.replaceChild($(canvas),targetEl);
}
}
);
var initMaskedImages = function(elementSelector,params){
var newWidth = params.width + (isIE && !isIE9 ? 1:0);
var newHeight = params.height + (isIE && !isIE9 ? 1:0);
var deltaWidth = Math.round(Math.tan(Math.PI / 13.85) * newHeight);
var deltaWidth2 = newWidth - deltaWidth;
var shadowImageWidth = 107;
var options ={
deltaWidth:deltaWidth,points:0 + ',' + 0 + ' ' + newWidth + ',' + 0 + ' ' + deltaWidth2 + ',' + newHeight + ' ' + 0 + ',' + newHeight,mapPoints:shadowImageWidth + ',' + 0 + ' ' + shadowImageWidth + ',' + newHeight + ' ' + (shadowImageWidth - deltaWidth) + ',' + newHeight,styleClass:'canvas',shadowImg:window.shadowIMG,shadowClass:'bnr_shadow',mapName:'map13degree',filterOpacity:0.2}
;
$extend(options,params);
var index = params.startIndex || 0;
$$(elementSelector || '.js_masked_image').each(function(targetEl){
if (targetEl.getParent('.content.basic').getElements('img').length <= 1 || targetEl.getParent().getNext('.image')){
new MaskedImage(targetEl,index++,options);
}
}
);
}
;
var ImageMenu = new Class({
openedItem:null,initialized:false,defaultOptions:{
OnOpen:$lambda(false),OnClose:$lambda(false),openWidth:600,width:(isIE7 || isIE6) ? 964:948,transition:Fx.Transitions.Quad.easeOut,duration:400,open:null,closeOnMouseOut:true,useDarking:false,filterOpacity:0.2,shadowWidth:100}
,initialize:function(targetEls,options){
if (!targetEls){
return;
}
if (isIE9){
try{
targetEls.getLast().getElement('.image img').setStyles({
position:'relative',top:'1px'}
);
}
catch(e){
}
}
this.setOptions(this.defaultOptions,options);
this.elements = targetEls;
this.itemCount = this.elements.length;
this.widths = this.calculateWidths();
this.fx = this.createFxElement();
var z_order = 1000;
this.elements.each(function(el,i){
el.width = this.widths.closed;
el.setStyle('z-index',z_order--);
if (i != 0){
el.setStyle('margin-left',-this.options.shadowWidth);
}
el.addEvents({
mouseover:function(e){
this.itemMouseOver(el,i,e)}
.bind(this),mouseleave:function(e){
this.itemMouseLeave(el,i,e)}
.bind(this)}
);
this.updateMapArea(el);
}
.bind(this));
this.open(this.options.open);
this.initAccessibility();
}
,createFxElement:function(){
var fx = new Fx.Elements(this.elements,{
wait:false,duration:this.options.duration,transition:this.options.transition}
);
fx.addEvents({
complete:function(){
if ($type(this.openedItem) == 'number'){
this.showOverContent(this.openedItem);
}
else{
this.showDefaultContent();
}
}
.bind(this),start:function(){
if (this.options.useDarking){
this.elements.each(this.itemCreateDarkingElement.bind(this));
}
this.hideContent();
}
.bind(this)}
);
return fx;
}
,calculateWidths:function(){
var widthType = $type(this.options.openWidth);
if (widthType == 'string'){
var width = parseInt(this.options.openWidth,10);
if (isNaN(width)){
this.options.openWidth = this.defaultOptions.openWidth;
}
else{
this.options.openWidth = (this.options.openWidth.indexOf('%') != -1) ? (this.options.width * width / 100):width;
}
}
var halfShadow = Math.round(this.options.shadowWidth / 2);
var itemWidth = Math.round(this.options.width / this.itemCount);
var lastOpenSelected = this.options.openWidth;
return{
closed:itemWidth + this.options.shadowWidth,firstLastClosed:itemWidth + halfShadow,openSelected:this.options.openWidth,lastOpenSelected:lastOpenSelected,openOthers:Math.floor((this.options.width - (lastOpenSelected)) / (this.itemCount - 1)) + this.options.shadowWidth}
;
}
,itemCreateDarkingElement:function(el,index){
var opacity = this.options.filterOpacity;
var isShow = this.openedItem == null || this.openedItem == index;
if (isIE && !isIE9){
var element = el.getElement('polyline');
if (element){
element = element.getNext();
}
if (!element){
element = el.getElement('.image img');
element.style.filter = isShow ? '':'progid:DXImageTransform.Microsoft.Alpha(opacity=' + opacity * 100 + ')';
}
else{
element.style.visibility = isShow ? 'hidden':'visible';
}
}
else{
element = el.getElement('g');
if (element){
element = element.getLast();
}
if (!element){
element = el.getElement('.image img').getParent();
element.style.opacity = isShow ? '':opacity;
}
else{
element.style.visibility = isShow ? 'hidden':'visible';
}
}
}
,itemMouseOver:function(item,index,e){
if (this.timerId){
window.clearTimeout(this.timerId);
}
this.timerId = undefined;
new Event(e).stop();
if (this.openedItem != index){
this.reset(index);
if (this.options.OnOpen){
this.options.OnOpen(item,index);
}
}
}
,itemMouseLeave:function(item,index,e){
new Event(e).stop();
if (this.options.closeOnMouseOut){
this.timerId = window.setTimeout(function(){
this.reset();
this.showDefaultContent();
if (this.options.OnClose){
this.options.OnClose(item,index);
}
}
.bind(this),100);
}
}
,open:function(open){
if (open != null){
if ($type(open) == 'number'){
this.reset(open);
}
else{
this.elements.each(function(el,i){
if (el.id == open){
this.reset(i);
}
}
,this);
}
}
else{
this.reset();
}
}
,initAccessibility:function(){
var imageMenu = this;
this.elements.each(function(item,index){
var controlLink = item.getElement(".js_banner_tabindex");
controlLink.addEvent("focus",function(event){
imageMenu.itemFocus(item,index,this.get("tabindex") + 1);
event.stop();
return false;
}
);
controlLink.addEvent("customblur",function(event){
imageMenu.reset();
return false;
}
);
if (index == 0){
controlLink.addEvent('keypress',function(event){
if (event.key == 'tab' && event.shift){
imageMenu.reset();
}
}
);
}
}
);
}
,itemFocus:function(item,index,subLinksTabIndex){
this.reset(index);
this.elements.each(function(item){
BannerTabIndexHelper.cleanUpTabIndexes(item.getElementsByTagName("a"))}
);
var links = BannerTabIndexHelper.filterControlLinks(item.getElementsByTagName("a")).rest;
links.each(function(link){
link.set("tabindex",subLinksTabIndex);
if (isIE){
link.innerHTML += "";
}
}
);
}
,updateMapArea:function(el){
var map = el.getElement('area');
if (map){
map.addEvents({
mouseover:function(e){
var nextEl = map.getParent(".content").getNext();
nextEl.fireEvent("mouseover",e);
}
,click:function(e){
new Event(e).stop();
var nextEl = map.getParent(".content").getNext();
nextEl.fireEvent("click",e);
}
}
);
}
return this;
}
,hideContent:function(){
this.hideOverContent();
this.hideDefaultContent();
}
,showOverContent:function(num){
if ($type(num) == 'number'){
var el = this.elements[num];
el.getElement('.over_content').removeClass('hidden');
}
}
,hideOverContent:function(){
this.elements.getElements('.over_content').each(function(el,index){
if (el.getParent().getElements('input')[0].getProperty('value') == 'store'){
if (el.getElements('.cta')[0]) el.getElements('.cta')[0].setStyle('display','none');
if (el.getElements('.links_2')[0]) el.getElements('.links_2')[0].hide();
}
el.addClass('hidden');
}
);
}
,hideDefaultContent:function(){
this.elements.getElements('.default_content').each(function(el,index){
el.addClass('hidden');
}
);
this.elements.getElements('.over_content').each(function(el,index){
if (el.getParent().getElements('input')[0].getProperty('value') == 'store'){
el.addClass('hidden');
}
}
);
}
,showDefaultContent:function(){
this.elements.getElements('.default_content').each(function(el,index){
el.removeClass('hidden');
}
);
this.elements.getElements('.over_content').each(function(el,index){
if (el.getParent().getElements('input')[0].getProperty('value') == 'store'){
el.removeClass('hidden');
el.getParent().getElements('.default_content')[0].addClass('hidden');
}
}
);
}
,reset:function(num){
this.fx.cancel();
var width;
var isNumber = $type(num) == 'number';
if (isNumber){
this.openedItem = num;
width = this.widths.openOthers;
}
else{
width = this.widths.closed;
this.openedItem = null;
}
var obj ={
}
;
this.elements.each(function(el,i){
var w = width;
if (isNumber){
}
else{
if (i == 0 || i == this.itemCount - 1){
w = this.widths.firstLastClosed;
}
}
obj[i] ={
'width':w}
;
}
.bind(this));
if (isNumber){
if (num == this.itemCount - 1){
obj[num] ={
'width':this.widths.lastOpenSelected}
;
}
else{
obj[num] ={
'width':this.widths.openSelected}
;
}
}
if (isNumber || (!isNumber && this.options.closeOnMouseOut) || !this.initialized){
this.fx.start(obj);
this.initialized = true;
}
}
}
);
ImageMenu.implement(new Options);
ImageMenu.implement(new Events);
function initImageMenu(maskedImagesOptions,bannerSelector,contentSelector,imageMenuOptions){
initMaskedImages(null,maskedImagesOptions);
return $$(bannerSelector).map(function(el){
return new ImageMenu(el.getElements(contentSelector),imageMenuOptions);
}
);
}
function externalOverContent(maskedImagesOptions,bannerSelector,contentSelector,imageMenuOptions){
var menus = initImageMenu(maskedImagesOptions,bannerSelector,contentSelector,imageMenuOptions);
menus.each(function(im){
if (im.elements.length == 0){
return;
}
var overContents = $("banner_area").getElement(".banner-over-content").getElements(".over_content");
im.showOverContent = function(num){
overContents.each(function(el){
el.addClass('hidden');
}
);
if ($type(num) == 'number' && overContents[num]){
overContents[num].removeClass('hidden');
}
}
;
im.hideOverContent = function(){
}
;
}
);
}
Fx.Carousel = new Class({
Extends:Fx,options:{
mode:'horizontal',childSelector:'',loopOnScrollEnd:true,showAtStart:0}
,initialize:function(el,options){
this.element = document.id(el);
this.parent(options);
var parentPos = this.element.getStyle('position');
if (parentPos != 'absolute' || parentPos != 'relative'){
el.setStyle('position','relative');
}
if (this.options.childSelector){
this.elements = el.getElements(this.options.childSelector);
}
else{
this.elements = el.getChildren();
}
this.isHorizontal = this.options.mode == 'horizontal';
this.currentIndex = this.options.showAtStart;
var offset = 0;
if (this.currentIndex < 0){
this.currentIndex = this.elements.length + this.currentIndex;
}
if (this.currentIndex > 0){
for (var i = 0;
i < this.currentIndex;
i++){
offset += this.elements[i][(this.isHorizontal ? 'offsetWidth':'offsetHeight')];
}
}
this.set([ - offset,0]);
}
,set:function(now){
var parentEl = this.element.getParent();
parentEl.scrollLeft = parentEl.scrollTop = 0;
this.element.setStyle((this.isHorizontal ? 'left':'top'),now[0] + 'px');
return this;
}
,compute:function(from,to,delta){
return [0,1].map(function(i){
return Fx.compute(from[i],to[i],delta);
}
);
}
,start:function(index){
if (!this.check(index)) return this;
var offset = 0;
for (var i = 0;
i < index;
i++){
offset += this.elements[i][(this.isHorizontal ? 'offsetWidth':'offsetHeight')];
}
var currentOffset = this.isHorizontal ? parseInt(this.element.getStyle('left'),10) || 0:parseInt(this.element.getStyle('top'),10) || 0;
this.currentIndex = index;
return this.parent([currentOffset],[ - offset]);
}
,toNext:function(){
if (this.timer) return this;
this.start.call(this,this.getNextIndex());
this.fireEvent('next');
var groups = $$('.group');
if (groups[this.currentIndex].getElements('.content').length > 0){
trackLoadMetrics(groups[this.currentIndex].getElements('.content')[0].getElement('.over_content .cta .button a').getAttribute('name'),groups[this.currentIndex].getElements('.content')[1].getElement('.over_content .cta .button a').getAttribute('name'),groups[this.currentIndex].getElements('.content')[2].getElement('.over_content .cta .button a').getAttribute('name'),this.currentIndex);
}
else if (groups[this.currentIndex].getElements('.segment_one_banner').length > 0){
if (groups[this.currentIndex].getElements('.segment_one_banner')[0].getElements('.image_url').length > 0){
trackLoadMetricsSOB(groups[this.currentIndex].getElements('.segment_one_banner')[0].getElement('.image_url').getAttribute('name'),this.currentIndex);
}
else{
trackLoadMetricsSOB(groups[this.currentIndex].getElements('.segment_one_banner')[0].getElement('.over_content .cta .button a').getAttribute('name'),this.currentIndex);
}
}
return this;
}
,toPrevious:function(){
if (this.timer) return this;
this.start.call(this,this.getPreviousIndex());
this.fireEvent('previous');
var groups = $$('.group');
if (groups[this.currentIndex].getElements('.content').length > 0){
trackLoadMetrics(groups[this.currentIndex].getElements('.content')[0].getElement('.over_content .cta .button a').getAttribute('name'),groups[this.currentIndex].getElements('.content')[1].getElement('.over_content .cta .button a').getAttribute('name'),groups[this.currentIndex].getElements('.content')[2].getElement('.over_content .cta .button a').getAttribute('name'),this.currentIndex);
}
else if (groups[this.currentIndex].getElements('.segment_one_banner').length > 0){
if (groups[this.currentIndex].getElements('.segment_one_banner')[0].getElements('.image_url').length > 0){
trackLoadMetricsSOB(groups[this.currentIndex].getElements('.segment_one_banner')[0].getElement('.image_url').getAttribute('name'),this.currentIndex);
}
else{
trackLoadMetricsSOB(groups[this.currentIndex].getElements('.segment_one_banner')[0].getElement('.over_content .cta .button a').getAttribute('name'),this.currentIndex);
}
}
return this;
}
,toIndex:function(index){
if (this.timer) return this;
if (index < 0){
index = 0;
}
else if (index >= this.elements.length){
index = this.elements.length - 1;
}
if (index == this.currentIndex) return this;
this.start.call(this,index);
this.fireEvent('index');
var groups = $$('.group');
if (groups[this.currentIndex].getElements('.content').length > 0){
trackLoadMetrics(groups[this.currentIndex].getElements('.content')[0].getElement('.over_content .cta .button a').getAttribute('name'),groups[this.currentIndex].getElements('.content')[1].getElement('.over_content .cta .button a').getAttribute('name'),groups[this.currentIndex].getElements('.content')[2].getElement('.over_content .cta .button a').getAttribute('name'),this.currentIndex);
}
else if (groups[this.currentIndex].getElements('.segment_one_banner').length > 0){
if (groups[this.currentIndex].getElements('.segment_one_banner')[0].getElements('.image_url').length > 0){
trackLoadMetricsSOB(groups[this.currentIndex].getElements('.segment_one_banner')[0].getElement('.image_url').getAttribute('name'),this.currentIndex);
}
else{
trackLoadMetricsSOB(groups[this.currentIndex].getElements('.segment_one_banner')[0].getElement('.over_content .cta .button a').getAttribute('name'),this.currentIndex);
}
}
}
,getNextIndex:function(){
if (this.currentIndex < this.elements.length - 1){
return++this.currentIndex;
}
else if (this.options.loopOnScrollEnd){
this.fireEvent('loop');
this.fireEvent('nextLoop');
return 0;
}
else{
return this.currentIndex;
}
}
,getPreviousIndex:function(){
if (this.currentIndex > 0){
return--this.currentIndex;
}
else if (this.options.loopOnScrollEnd){
this.fireEvent('loop');
this.fireEvent('previousLoop');
return this.elements.length - 1;
}
else{
return this.currentIndex;
}
}
,getCurrentIndex:function(){
return this.currentIndex;
}
,getItemsCount:function(){
return this.elements.length;
}
}
);
HomeCarousel = new Class({
Implements:Options,options:{
loopOnScrollEnd:false,tabindex:101}
,initialize:function(targetEl,leftEl,rightEl,scrollerEl,options){
if (!targetEl){
return;
}
this.setOptions(options);
var carousel,scrollerEls;
var updateScrollers = function(){
scrollerEls.each(function(el,index){
if (carousel.getCurrentIndex() == index){
el.addClass('enabled');
}
else{
el.removeClass('enabled');
}
}
);
}
;
var carouselOptions ={
mode:'horizontal',onStart:updateScrollers}
;
carousel = new Fx.Carousel(targetEl,$extend(carouselOptions,this.options));
scrollerEls = this.createScrollers(scrollerEl,leftEl,rightEl,carousel);
updateScrollers();
this.updateTabIndexes.call(carousel);
carousel.addEvents({
index:this.updateTabIndexes,next:this.updateTabIndexes,previous:this.updateTabIndexes}
)}
,createScrollers:function(scrollerEl,leftEl,rightEl,carousel){
var scrollerEls = this.cloneScrollerElements(scrollerEl,carousel.getItemsCount());
if (leftEl){
this.addEventsToArrow(carousel,leftEl,carousel.toPrevious.bind(carousel),"left_arrow_hover");
}
if (rightEl){
this.addEventsToArrow(carousel,rightEl,carousel.toNext.bind(carousel),"right_arrow_hover");
}
if (scrollerEls){
scrollerEls.each(function(el,index){
var toIndex = function(e){
if (index != carousel.getCurrentIndex()){
if ($$('.group')[carousel.getCurrentIndex()].getElements('.segment_one_banner').length <= 0){
$$('.group')[carousel.getCurrentIndex()].getElements((rtl ? '.last':'.first') + ' .js_banner_tabindex')[0].fireEvent('customblur');
}
}
carousel.toIndex(index);
if (e.key == "enter"){
if (rtl){
if ($defined($$('.group')[index].getElements('.last .js_banner_tabindex')[0])){
$$('.group')[index].getElements('.last .js_banner_tabindex')[0].focus();
}
else{
$$('.group')[index].getElements('.segment_one_banner .js_banner_sobanner_tabindex')[0].focus();
}
}
else{
if ($defined($$('.group')[index].getElements('.first .js_banner_tabindex')[0])){
$$('.group')[index].getElements('.first .js_banner_tabindex')[0].focus();
}
else{
$$('.group')[index].getElements('.segment_one_banner .js_banner_sobanner_tabindex')[0].focus();
}
}
}
}
;
el.addEvent("click",toIndex);
el.getElement("a").addEvents({
focus:function(){
this.getParent(".carousel_group").addClass("carousel_group_hover");
}
,blur:function(){
this.getParent(".carousel_group").removeClass("carousel_group_hover");
}
,keypress:function(e){
if (e.key == "enter"){
toIndex(e);
}
}
}
);
}
);
}
var tabIndex = this.options.tabindex + 10;
var links = $$("#controls #carousel a");
if (rtl){
links.reverse();
}
for (var i = 0;
i < links.length;
i++,tabIndex++){
links[i].set("tabindex",tabIndex);
}
return scrollerEls;
}
,updateTabIndexes:function(){
this.elements.each(function(banner,index){
if (index == this.currentIndex){
var images = this.elements[index].getElements(".content");
if (this.elements[index].getElements(".segment_one_banner").length > 0){
images = this.elements[index].getElements(".segment_one_banner");
}
else{
BannerTabIndexHelper.cleanUpTabIndexes(banner.getElementsByTagName("a"));
}
if (rtl){
images = images.reverse();
}
var length = images.length - 1;
if (length > 0){
for (var i = 0;
i <= length;
i++){
var image = images[i];
var a = image.getElements(".js_banner_tabindex")[0];
a.set("tabindex",this.options.tabindex + 2 * i);
}
}
else{
var links = images.getElements("a");
var l_tabi = this.options.tabindex;
links.each(function(link){
link.set("tabindex",l_tabi + 1);
}
);
var a = images.getElements(".js_banner_sobanner_tabindex")[0];
a.set("tabindex",this.options.tabindex);
}
}
else{
banner.getElements("a").each(BannerTabIndexHelper.hideTabIndexes);
}
}
.bind(this));
}
,addEventsToArrow:function(carousel,arrow,pressEnterHandler,focusClass){
arrow.addEvent("click",pressEnterHandler);
arrow.getElement("a").addEvents({
focus:function(){
this.getParent("div").addClass(focusClass);
}
,blur:function(){
this.getParent("div").removeClass(focusClass);
}
,keypress:function(e){
if (e.key == "enter"){
pressEnterHandler();
}
}
}
);
}
,cloneScrollerElements:function(el,count){
if (!el) return [];
var elements = [];
for (var i = 0;
i < count - 1;
i++){
var clone = el.clone();
clone.cloneEvents(el);
elements.push(el.clone());
}
var parentEl = el.getParent();
parentEl.adopt(elements);
this.updateStyles(parentEl.getParent());
return parentEl.getChildren();
}
,updateStyles:function(el){
el.setStyle('width',el.getDimensions().x);
el.removeClass('hidden');
}
}
);
var imageMenuContainer = [];
initHomeCarousel = function(rtl_flag,promoAreaId,bannersSelector,bindOnEvent,eventName){
var handler = function(){
initMaskedImages(null,{
width:642,height:394}
);
var selector = '#' + (promoAreaId || 'banner_area') + ' ' + (bannersSelector || '.banner');
var banners = $$(selector);
banners.each(function(el){
imageMenuContainer.push(new ImageMenu(el.getElements('.content'),{
openWidth:642,useDarking:true}
));
}
);
new HomeCarousel($(promoAreaId || 'banner_area').getFirst(),$('left_arrow'),$('right_arrow'),$('carousel').getElement('.carousel_group'),{
showAtStart:(rtl_flag ? -1:0)}
);
}
;
if (bindOnEvent){
window.addEvent(eventName || 'load',handler);
}
else{
handler();
}
}
;
function rtlPatch(){
if (rtl === true){
if (isIE6 || isIE7 || document.documentMode === 7){
var buttonEl = $$('.cta .button');
buttonEl.each(function(el){
el.getElements('.arrow')[0].inject(el.getElements('.text')[0],'before');
}
);
}
}
}
CSS代码(zzsc.css):
@charset "utf-8";/* CSS Document */
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,form,img,dl,dt,dd,table,th,td,blockquote,fieldset,div,strong,label,em{margin:0;padding:0;border:0;}
ul,ol,li{list-style:none;}
input,button{margin:0;font-size:12px;vertical-align:middle;}
body{font-size:12px;font-family:Arial,Helvetica,sans-serif;color:#333;margin:0 auto;background:#111;}
table{border-collapse:collapse;border-spacing:0;}
a{color:#333;text-decoration:none;}
a:hover{color:#c00;text-decoration:underline;}
.hidden{DISPLAY:none}
.screenReading{POSITION:absolute;WIDTH:0px;HEIGHT:0px;OVERFLOW:hidden;opacity:0}
#everything{POSITION:relative}
#newsroom_ticker_right{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#newsroom_ticker_left{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #carousel_container{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #left_arrow{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #left_arrow:hover{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel .left_arrow_hover{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #right_arrow{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel .right_arrow_hover{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #carousel_container DIV.enabled .carousel_box{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #carousel_container DIV.carousel_group:hover .carousel_box{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#carousel #carousel_container DIV.carousel_group_hover .carousel_box{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
.over_content .button A{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
SPAN.right_side{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
.over_content .button .arrow{BACKGROUND:url(../images/homepage_sprite.gif) no-repeat 0px 0px}
#controls{Z-INDEX:0;POSITION:relative;BACKGROUND-COLOR:#111;MARGIN-TOP:5px;WIDTH:100%;BOTTOM:0px;MARGIN-BOTTOM:20px;HEIGHT:auto}
#promo_area{POSITION:relative;MIN-WIDTH:964px;MIN-HEIGHT:394px;WIDTH:964px;BACKGROUND-REPEAT:no-repeat;DIRECTION:ltr;HEIGHT:394px;MARGIN-LEFT:27px;OVERFLOW:hidden;_margin-left:37px;margin:0 auto;}
.clear{CLEAR:both}
DIV.content .default_content .text_top{FONT-FAMILY:Arial,Helvetica,sans-serif;FONT-SIZE:11pt;FONT-WEIGHT:500;color:#fff}
DIV.content .default_content .text_bottom{FONT-FAMILY:Arial,Helvetica,sans-serif;FONT-SIZE:13pt;FONT-WEIGHT:500;color:#fff}
.title{PADDING-LEFT:46px;FONT-FAMILY:Arial,Helvetica,sans-serif;WORD-WRAP:break-word;MARGIN-BOTTOM:12px;FONT-SIZE:20pt;color:#fff;}
.message{PADDING-LEFT:48px;FONT-FAMILY:Arial,Helvetica,sans-serif;MARGIN-BOTTOM:12px;FONT-SIZE:9pt;PADDING-TOP:5px;color:#fff}
.over_content .cta SPAN.price_label{FONT-SIZE:11pt}
.over_content .cta SPAN.price_value{PADDING-BOTTOM:18px;FONT-SIZE:18pt}
.over_content .cta{MARGIN-TOP:18px;PADDING-LEFT:48px;WIDTH:auto;DISPLAY:inline-block;FONT-FAMILY:Arial,Helvetica,sans-serif;HEIGHT:auto;FONT-SIZE:10px;PADDING-TOP:0px}
.over_content .button{HEIGHT:18px;OVERFLOW:hidden}
.over_content .button A{POSITION:relative;DISPLAY:inline-block;BACKGROUND-POSITION:-55px 0px;HEIGHT:19px;FONT-WEIGHT:700;TEXT-DECORATION:none;_padding-left:2px}
.over_content .button A:hover{BACKGROUND-POSITION:-55px -20px}
.center_side{POSITION:relative;PADDING-LEFT:6px;WIDTH:auto;PADDING-RIGHT:8px;BACKGROUND:#007ca2;FLOAT:left;HEIGHT:18px;MARGIN-LEFT:2px;PADDING-TOP:0px;_margin-left:0;_zoom:1;line-height:18px;font-family:"宋体";font-size:12px;}
.center_side .text{color:#fff;float:left;font-weight:normal;padding-right:3px;cursor:pointer;}
.over_content .msg_txt{DISPLAY:none;FONT-FAMILY:Arial,Helvetica,sans-serif;FONT-SIZE:18px}
.over_content .signup{DISPLAY:none;FONT-FAMILY:Arial,Helvetica,sans-serif;FONT-SIZE:18px}
#promo_area DIV .left{POSITION:relative;MIN-HEIGHT:394px;WIDTH:348px;DISPLAY:block;BACKGROUND:no-repeat 0px 50%;FLOAT:left;HEIGHT:394px;OVERFLOW:hidden}
#promo_area DIV .center{POSITION:relative;MIN-HEIGHT:394px;WIDTH:348px;DISPLAY:block;BACKGROUND:no-repeat 0px 50%;FLOAT:left;HEIGHT:394px;OVERFLOW:hidden}
#promo_area DIV .right{POSITION:relative;MIN-HEIGHT:394px;WIDTH:348px;DISPLAY:block;BACKGROUND:no-repeat 0px 50%;FLOAT:left;HEIGHT:394px;OVERFLOW:hidden}
#promo_area DIV .left{Z-INDEX:1000}
#promo_area DIV .center{Z-INDEX:500}
#promo_area DIV .right{FLOAT:right;LEFT:-1px}
.newsroom_ticker_content A{COLOR:#66cc00;TEXT-DECORATION:none}
.newsroom_ticker_content A:hover{COLOR:#66cc00;TEXT-DECORATION:none}
.link_list{WIDTH:450px;MARGIN-LEFT:39px}
.link_list UL{LIST-STYLE:none none outside;PADDING-BOTTOM:0px;PADDING-LEFT:0px;WIDTH:200px;PADDING-RIGHT:0px;MARGIN-BOTTOM:0px;FLOAT:left;MARGIN-LEFT:10px;PADDING-TOP:0px}
.link_list LI{PADDING-BOTTOM:7px;PADDING-LEFT:0px;PADDING-RIGHT:0px;FONT-SIZE:9pt;PADDING-TOP:4px}
.link_list A{TEXT-DECORATION:none}
.link_list A:hover{COLOR:#fff;TEXT-DECORATION:underline}
.content A{COLOR:#fff}
.content.black A{COLOR:#000}
#imageMenu{POSITION:relative;WIDTH:500px;HEIGHT:200px;OVERFLOW:hidden}
#imageMenu UL{LIST-STYLE-TYPE:none;MARGIN:0px;WIDTH:1000px;DISPLAY:block;HEIGHT:200px}
#imageMenu UL LI{FLOAT:left}
#imageMenu UL LI A{TEXT-INDENT:-1000px;WIDTH:98px;DISPLAY:block;BACKGROUND:#ffffff 0px 50%;HEIGHT:200px;OVERFLOW:hidden;CURSOR:pointer;BORDER-RIGHT:#fff 2px solid}
.clear{CLEAR:both}
#promo_area .group_container{WIDTH:3000px}
#promo_area .group{FLOAT:left;_margin-right:0}
#promo_area .banner{Z-INDEX:0;POSITION:relative;BACKGROUND-COLOR:#000000;MIN-HEIGHT:394px;WIDTH:964px;TEXT-OVERFLOW:clip;HEIGHT:394px;OVERFLOW:hidden}
.banner .content{POSITION:relative;DISPLAY:block;BACKGROUND:none transparent scroll repeat 0% 0%;FLOAT:left;OVERFLOW:hidden;CURSOR:pointer}
#promo_area .banner .image{DIRECTION:rtl}
.banner_focus{POSITION:absolute;LEFT:200px}
.banner .last{position:absolute;RIGHT:0px;}
.banner .nonmouseover{DISPLAY:none;VISIBILITY:hidden}
.banner .mouseover{DISPLAY:none;VISIBILITY:hidden}
#promo_area .over_content{POSITION:relative;WIDTH:307px;DIRECTION:ltr;FLOAT:left;HEIGHT:250px;TOP:-360px;LEFT:55px;}
#promo_area .last .over_content{*TOP:-340px;}
#promo_area .first .over_content{LEFT:0px;_margin-left:0;}
#promo_area .default_content{POSITION:relative;LINE-HEIGHT:24px;MARGIN:auto;WIDTH:300px;DIRECTION:ltr;FLOAT:left;HEIGHT:50px;OVERFLOW:hidden;top:-64px;*top:-88px;LEFT:43px}
#promo_area .last .default_content{*top:-64px;}
#carousel{POSITION:relative;MARGIN:10px auto 15px;WIDTH:343px;DIRECTION:ltr;HEIGHT:20px;CURSOR:pointer}
#carousel #carousel_container{WIDTH:303px;BACKGROUND-REPEAT:repeat-x;BACKGROUND-POSITION:-17px -130px;FLOAT:left;HEIGHT:19px}
#carousel .enabled.carousel_box{WIDTH:303px;BACKGROUND-REPEAT:repeat-x;BACKGROUND-POSITION:-17px -130px;FLOAT:left;HEIGHT:19px}
#carousel .carousel_box:hover{WIDTH:303px;BACKGROUND-REPEAT:repeat-x;BACKGROUND-POSITION:-17px -130px;FLOAT:left;HEIGHT:19px}
#carousel .enabled.carousel_box:hover{WIDTH:303px;BACKGROUND-REPEAT:repeat-x;BACKGROUND-POSITION:-17px -130px;FLOAT:left;HEIGHT:19px}
#carousel #left_arrow{WIDTH:20px;BACKGROUND-REPEAT:no-repeat;BACKGROUND-POSITION:0px 0px;FLOAT:left;HEIGHT:19px}
#carousel #left_arrow:hover{WIDTH:20px;BACKGROUND-POSITION:0px -19px;FLOAT:left;HEIGHT:19px}
#controls #carousel .left_arrow_hover{WIDTH:20px;BACKGROUND-POSITION:0px -19px;FLOAT:left;HEIGHT:19px}
#carousel #right_arrow{POSITION:relative;WIDTH:20px;BACKGROUND-POSITION:-330px 0px;FLOAT:left;HEIGHT:19px;LEFT:-10px}
#carousel #carousel_container DIV.carousel_group{WIDTH:auto;HEIGHT:auto}
#carousel #carousel_container .carousel_group .carousel_box{POSITION:relative;WIDTH:101px;FLOAT:left;HEIGHT:19px;margin-right:-5px;}
#carousel #right_arrow:hover{WIDTH:20px;BACKGROUND-POSITION:-330px -19px;HEIGHT:19px}
#controls #carousel .right_arrow_hover{WIDTH:20px;BACKGROUND-POSITION:-330px -19px;HEIGHT:19px}
#carousel .clicked_right{WIDTH:20px;BACKGROUND-POSITION:-330px -19px;HEIGHT:19px}
#carousel #carousel_container DIV.enabled .carousel_box{WIDTH:101px;BACKGROUND-REPEAT:no-repeat;BACKGROUND-POSITION:-11px -101px}
#carousel #carousel_container DIV.carousel_group:hover .carousel_box{Z-INDEX:6000;POSITION:relative;WIDTH:101px;BACKGROUND-POSITION:-14px -73px}
#carousel #carousel_container DIV.carousel_group_hover .carousel_box{Z-INDEX:6000;POSITION:relative;WIDTH:101px;BACKGROUND-POSITION:-14px -73px}
#carousel #carousel_container DIV.enabled:hover .carousel_box{WIDTH:101px;BACKGROUND-REPEAT:no-repeat;BACKGROUND-POSITION:-11px -101px}
#carousel #carousel_container .carousel_group_hover .carousel_box{WIDTH:101px;BACKGROUND-REPEAT:no-repeat;BACKGROUND-POSITION:-11px -101px}
#carousel .left .carousel_box{LEFT:0px}
#carousel .middle .carousel_box{LEFT:-5px}
.over_content .button .arrow{background-position:-283px -42px;float:left;line-height:15px;width:5px;}
span.right_side{background-position:-280px 0;float:left;height:18px;padding:0 3px 0 0;}
分享到QQ
分享到微博
微信扫一扫
