The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

WOW Slider not working

View previous topic View next topic Go down

Solved WOW Slider not working

Post by JAN2XONLINE on January 27th 2013, 1:15 am

Code:
<html>
        <head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
            <title>Wow slider</title>
        <style>
          #wowslider-container {
/*  overflow: hidden; */
  zoom: 1;
  position: relative;
  width:960px;
  height:360px;
  margin:0 auto;
  z-index:100;
  border:10px solid #FFFFFF;
}
* html #wowslider-container{
  background-image: none;
}
#wowslider-images{
  position: relative;
  width:960px;
  height:360px;
  overflow:hidden;
}
#wowslider-images a{
  color:transparent;
}

#wowslider-images img{
  top:0;
  left:0;
  border:none 0;
}
#wowslider-container a{
  text-decoration: none;
  outline: none;
  border: none;
}

#wowslider-container  .ws_bullets {
  font-size: 0px;
  padding: 0px;
  float: left;
  position:absolute;
    right: 5px;
    top: 10px;
  z-index:40;
}
#wowslider-container .ws_bullets a {
  margin: 0 3px;
  width:21px;
  height:21px;
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet.png);
  float: left;
  text-indent: -1000px;
  position:relative;
}
* html #wowslider-container .ws_bullets a {
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet.gif);
}
#wowslider-container .ws_bullets a.ws_selbull{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.png);
}
#wowslider-container .ws_bullets a:hover{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.png);
}
* html #wowslider-container .ws_bullets a:hover{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.gif);
}
* html #wowslider-container .ws_bullets a.ws_selbull{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.gif);
}
#wowslider-container a.ws_next, #wowslider-container a.ws_prev {
  position:absolute;
  display:none;
  top:50%;
  margin-top:-22px;
  position:absolute;
  z-index: 999;
  height: 45px;
  width: 45px;
  background-image: url(http://wowslider.com/images/demo/flux-slices/engine/arrows.png);
}
* html #wowslider-container a.ws_next, * html #wowslider-container a.ws_prev{
  background-image: url(http://wowslider.com/images/demo/flux-slices/engine/arrows.gif);
}
#wowslider-container a.ws_next{
  background-position: 100% 0;
  right:10px;
}
#wowslider-container a.ws_prev {
  left:10px;
  background-position: 0 0;
}
* html #wowslider-container a.ws_next,* html #wowslider-container a.ws_prev{display:block}
#wowslider-container:hover a.ws_next, #wowslider-container:hover a.ws_prev {display:block}


#wowslider-container .ws-title{
  position: absolute;
  bottom:25px;
  left: 0px;
  margin-right:30px;
  z-index: 50;
  padding:10px;
  opacity:0.8;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80); 
  color: #000000;
  background:#FFF;
    font-family: Tahoma,Arial,Helvetica;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 18px;
    text-align: left;
    text-shadow: 0 0 2px #FFFFFF; 
  -moz-border-radius:0 8px 8px 0;
  -webkit-border-radius:0 8px 8px 0;
  border-radius:0 8px 8px 0;
  font-size: 14px;
}
#wowslider-container .ws-title div{
  padding-top:5px;
  font-size: 12px;
}#wowslider-container .ws_bullets  a img{
  text-indent:0;
  display:block;
  top:20px;
  left:-120px;
  visibility:hidden;
 
  position:absolute;
    -moz-box-shadow: 0 0 18px #FFF;
    box-shadow: 0 0 18px #FFF;
    border: 3px solid #FFFFFF;
}
#wowslider-container .ws_bullets a:hover img{
  visibility:visible;
}

#wowslider-container .ws_bulframe div div{
  height:90px;
  overflow:visible;
  position:relative;
}
#wowslider-container .ws_bulframe div {
  overflow:hidden;
  position:relative;
  width:240px;
}
#wowslider-container .ws_bulframe{
  display:none;
  top:25px;
  overflow:visible;
 
  position:absolute;
  cursor:pointer;
    -moz-box-shadow: 0 0 18px #FFF;
    box-shadow: 0 0 18px #FFF;
    border: 3px solid #FFFFFF;
}
#wowslider-container .ws_bulframe span{
  display:block;
  position:absolute;
  top:-9px;
  margin-left:0px;
  left:120px;
  background:url(http://wowslider.com/images/demo/flux-slices/engine/triangle.png);
  width:15px;
  height:6px;
}
#vlb {
    display: none;
}</style>
        </head>
        <body>
  <div id="wowslider-container">
  <div id="wowslider-images">
<a href="http://animepinoy.4rumer.com/register"><img src="http://i855.photobucket.com/albums/ab117/jan2xonline/WELCOMETOANIMEPINOY2_zpse3df4a1d.jpg"id="wows0"/></a>
<a href="#"><img src="http://i855.photobucket.com/albums/ab117/jan2xonline/CHOOSEYOURSIDE_zps00a5a8f2.jpg"id="wows1"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/611418.jpg"id="wows2"/></a>

<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/forest_wallpaper21.jpg"id="wows3"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/g7503.jpg"id="wows4"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/ge202.jpg"id="wows5"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/mozh_les.jpg"id="wows6"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/nature_forest_forest_010852_.jpg"id="wows7"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/widescreen_forest_004692_.jpg"id="wows8"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/world_canada_rain_forest_007534_.jpg"id="wows9"/></a>
</div><div class="ws_bullets">
<a href="#wows0"</a>
<a href="#wows1"</a>
<a href="#wows2"</a>
<a href="#wows3"</a>
<a href="#wows4"</a>
<a href="#wows5"</a>
<a href="#wows6"</a>
<a href="#wows7"</a>
<a href="#wows8"</a>
<a href="#wows9"</a>
</div>
<a id="vlb" href="http://wowslider.com">Div Slider jQuery</a>
  </div>

  <script>/*
 * jQuery Nivo Slider v2.3 fixed 2
 * http://nivo.dev7studios.com
 *
 * Copyright 2010, Gilbert Pellegrom
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 *
 * Jan 2011 fixed by wowslider.com - random effect selecting bug
 * Dec 2010 fixed by wowslider.com - added position:absolute to slice elements, added nivoRun external function to manual start
 * May 2010 - Pick random effect from specified set of effects by toronegro
 * May 2010 - controlNavThumbsFromRel option added by nerd-sh
 * May 2010 - Do not start nivoRun timer if there is only 1 slide by msielski
 * April 2010 - controlNavThumbs option added by Jamie Thompson (http://jamiethompson.co.uk)
 * March 2010 - manualAdvance option added by HelloPablo (http://hellopablo.co.uk)
 */
//////////////////////////////////////////////
// Obfuscated by Javascript Obfuscator 4.2  //
// http://javascript-source.com            //
//////////////////////////////////////////////
eval((function(x){var d="";var p=0;while(p<x.length){if(x.charAt(p)!="`")d+=x.charAt(p++);else{var l=x.charCodeAt(p+3)-28;if(l>4)d+=d.substr(d.length-x.charCodeAt(p+1)*96-x.charCodeAt(p+2)+3104-l,l);else d+="`";p+=4}}return d})("(function ($) {var NivoSlider = ` 5&element, options` G#settings = $.extend({}, $.fn.n` b%.defaults` V&;var vars = {current` H!:0, ` )#Image:\"\", total` :!s:0, randAnim` 7!running:false, paused` &$stop` &\"}`!-!s`\"3$$`\"+$);` .\".data(\"nivo:vars\",`!Z!` 6%css(\"position\", \"relative\"` :%addClass` `\"`\"U\"\"`\"D\"kids =`!8#.children();kids.each`$!'`#V#` A!`!f!thi`#+#link = \"\";if (!` >!.is(\"img\")) {if (` ,&a` /!` *\"`!P*-imageLink\");` o#` C!;}`!0$` Q\"find` z!:first\");}`!T%Width` A%width()`!U!` 3(= 0`!=$` C*attr(\"` R!` j)Height` >%h` *!` m(` 9$` o'` E+` u\"` T\"\");}`!E+>`$\"$`!m#) {` $)` A&` P(` }#` T%`!Q$` T&` +#` C'` Y#`#]!!= \"\") {link`&*\"display\", \"none\")`#w#` &4vars.`(\"'++;}`\"r\"`)B$.star`(d\" >`\"z!` %5=`'\\!` c() {` 60` 7. - 1`$L!s.`)p( =`*i%` U'`\"\\\"$(kids[` C-])`'3)` 4(`*[!`'|!` C4;} else` 'L`'A0`!A?`(h\"` *7`$F,block\");}`+8(background\", \"url(\" +`#\\\"`!u(`'<#src\") + \") no-repeat\");for (var i = 0; i <`#p'lices; i++`/ $lice`)5$Math.`!<!(`'x* /` T,`&6\"i =`$m(` 5! - 1`'n&append($(\"<div class=\\`+c\"` K!\\\"></div>\"`# \"{left:`!L'* i + \"px\", `!J!:`!M+-`!y(` B(`.l$:\"absolute\"})`%P&` dz` 5$`!-<`&:!`#:%ca`2a!`\"zB` F#\\\"><p></p`!X+`&H#:`*}\", opacity:` },O` 2\"})`$n\"`&84title\")`,C%var ` /!`*^$` :6` s!` '!.substr(0, 1) == \"#\") {` `$$` @\").html();}$(\".`\"@( p\",`.>#` >#` K\";` 9,` <'fadeIn`#Z&animSpeed);}`0v!timer`(I!`36!` @%manualAdvance &&`4G!.leng`0D!1`!t!` U\"setInterval`4A*nivoRun`(i#,` ^!,`(J%, false);}` *&.pauseTime`+u#` 0%dire` u!Nav`%Q-`%M/` D(\\\"><a` 1*prev` 4\"Prev</a` 1-next` <\"Next` =!`&;#`0l*` }(Hide`-G!`$)#` 0(`$P(ide();`2v$over`#+*` A<show(`#4!` *I`!1#}`&6\"a` F\"`\"c#` <'live(\"click\"` s+`(;%running) {return`$f\";}clear`%E%`%]!);`%a$\"\"`4E\"`2p)-= 2;`%J<\"prev\"`!v!`!p&`$;#` x~`!u!`!B=nex`3.!`'*,control`'2\"var nivoC` /\"`*R!`,j0` K%`.V'`%i$`'n#` \\'`2D2`)g'`2N$`!B3Thumbs`!X#child =` Y\"eq(i`'k\"!` 3!.is(\"img\")) {` B$` 4\"find` 7!:firs`\"f!` r9FromRel`+!#`\"##`*(&`)@+` W#\\\" rel=\\\"\" +`14\"\\\"><img src` 0#`!I\"`._\"rel\")` A\" alt=\\\"\\\" /></a>\"`2d&` Fwsrc\").replace`\"S6Search`->'` 1,R` \\\"`!q7`!Ed\" + (i + 1`!(!` v%`0|&`!R% a:eq(\" +`2X)`*2\"+ \")`)P'addClass(\"active\"`1k(` f'`)Gcif ($(this).has`!,+`*,M`)3#css(\"background\", \"url`\"P-Image`%4(`\"h! no-repeat\")`-5/= `!h$`'.(- 1`+X>`#9#`+i0keyboard`+x\"$(window).keypress`1-'event`#U#` '!.keyCode == \"37\"`.~~`/^>`!F39` xa`/:E`#V-pauseOnHover) {`%h#hover`#W'`.;\"` G#d = true;`!6<}`'m+` U*`\"5\"if ` T\"`\"j!\" && !`!T%manualAdvance) {` t$set`!.%` u)`\"H<`!/!);}`,D'`!K!Time`\"w#`\"[#b`0/!nivo:animFinished`),`$J(`\"+%$(kids).each`!R*`*1(is(\"a`*-!` *$`)`!display\", \"none`$N#` S\"kids[`&X-]` ^*` ,5` o,block`&s$`#t,`$@(`#2~`#y7` ,%afterChange.call`#/\";});this`.k!Run =`$6'index, effec`*y$`(k9`!$%` M\" =` U# ||`!T&` -\"`-41`!,!`,vA`\"O#`!8#`(j!};var `!t0` M4nudge`&`\"`/B! =`1<#.data`'8#vars\"`%|\"` ?!&&`2A/==` /\"total` .!s - 1) {`\"N%las` G\"`#q)if ((`%i! ||` ^\"stop)`%p!`!X$`#N3before`$a.if (` S%`10m} else`%G\"`! !`'q!`/!\"` ;p` z*`.c\"` 4p}`$e-++`%-%`$m=`,d$`'B+0;`$E%`!m!showEnd`%2-` J.< 0` ]3`&50` `\"`,c;img`,!`\"i- = ` A6`%(%` )J.f`/}!img:firs`$b%`\"g%controlNav`.R!\"`+}!-` ,& a\",`)H#).removeClass(\"active\");` A1:eq`%/-`#5\"+ \")` i'add` a,`!S+aption`--(`%}/title\") != \"\"`+F#` /!`$C$` :6`4W#tle.substr(0, 1)`'d!#\"`08!` b\"$` @\").html(`!a#`\"T&`!b\"`\"0'`1^)` j\"`1g#`#_(` Q\" p` N'fadeOut`\"Z&animSpeed`4J+`3l$`!L!`!W\";` ,$fadeIn` Q/`1)!`&'$`!+9` k(}`\".7` o8` q3`\")A`*i# i`)!` Z%slice` V'each`4@*var ` A!Width = Math.`,8!`1@#.width() /`2i&` M!s`#8&css({height:\"0px\", opacity:\"0\", `-(&:`,[Q -\" +`2s!`!a$+ i *`!n(-` \"'` Z!px 0%\"});i++;}`'6\"`!x%effect`&D!random`(\"$anims = new Array(\"` s!DownRight\", ` (&Lef` '&Up` 3*Up` 0+` R.` .\"` ?$fol`0-!fade\");`\"|!randAnim =`!U\"[`$;!floor(`$E\"`!z!() * (` =!.leng`\"}!1))]`0(&` `&= undefined`.6$` |'`!9\";}`+N*`#+\".indexOf(\",`+<\"-1`#)+` A,split` J!`!-$.trim`!o\"`!{8`\"*()]);`2S\"running = true`$e5`$B%\" ||`!N,` 4*`$5\" ||`&u\"`#$(` 10` O9`$n!` L;` ?!`.X%meBuff`)z!`)&`)U%s`.0!`* 2`\":>`!\"H` n=._reverse();}` H\"`+<8`0(\"his);` +!`+&\"top:0, bottom:\"`)b!f (i =`%x'`!D#- 1) {setTimeout` {*` o\"animate`+{&100%`+z(1.0\"},` r&`0='\"\"`0=+`-1#trigger(\"nivo:animFinished\"`03\", 100 +`$T%`/:&` ut` 2`%t%+= 50`-($`!E#`%@9Up`'-:`,k$`%a7` 7(` M7`&C<` ;#`'.}` ~H`')~`(#$\"\"`(#%0`')~`')~`')~`'8o`0$>`4W(`%e9`0#C` C\"`&O>`0#Gv`'_f`!*N`'Vw`(*%0`%s%`0P5++`&T&`(j:`#(!}if (v`(-~`(-~`(-~`(q:v`(jAfold`%}3` 6!`'G:`&\"5`%bBvar origWidth =` :\".width(`.e.0px\", `\"~+` H!` 6\"`.Ce` n\"`!P%`$}~`%AZ`!<O`.Egfade`%i4ade`%y$`%?M`%]#`%;!\"`%/\"\", `%1\"`$h=` U$`\"{%`\"Q> * 2`$+W`$L#` bS);}`#f$}`(1!tra`(E!`!B&msg) {if ` }!.console && typeof ` +#.log != \"undefine`)!` 2'` e!;}};` c!stop` {)` ~#!$(element).data`\"S#vars\")` Q!`#b!` %; = true;`\"*!(\"Stop S`#M!\"`!7(art`!00` [dfals`!9'art`!8)`$)&fterLoad.call`,=#};$.fn`'1!` O\"`!])options) {return `\"-!`-(2`!b#`39+` /#`!s'`&M\"\")` l%;}var ` 1& = new N`!J%` j!, `!E$;` [5,` ['`'2\"`\".,.defaults = {`*A\":\"random`)i\"ces:15, `'7%:500, pauseTime:3000, `$p!` n!:0, dire`\"h!Nav:true` %*Hide` 0#ca`\" !` &$ontrol` L&` '&Thumbs:`$w!` &.FromRel` '4Search:\".jpg\"` -.Replace:\"_thumb` ?#keyboard`!D&`\"P!OnHover` ,#manualAdvance`!6%`\"/\"O`*e#0.8, beforeChange:`%_)}, `&e!` %3`$Y!showEnd` ,-las`#o#` ^1Loa` D,`%;#_reverse = [].` &#;})(jQuery);"))// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************
var ws_slices=function(options){var $=jQuery;var $new_cont;var $Imgs;var $As;var cur_index=0;this.init=function(aCont){var $container=$(aCont);$new_cont=$("<div id=\""+$(aCont).attr("id")+"-new\"></div>");$container.append($new_cont);$As=$(aCont).find("A");$Imgs=$As.find("img");$new_cont.css({left:(options.outWidth-options.width)/2+"px",top:(options.outHeight-options.height)/2+"px",width:options.width+"px",height:options.height+"px",'background-color':"#FFF",position:"absolute"});$new_cont.append($As);slider=$new_cont.nivoSlider({directionNav:false,keyboardNav:false,controlNav:false,manualAdvance:true,caption:0,effect:"sliceDownRight,sliceDownLeft,sliceUpRight,sliceUpLeft,sliceUpDownRight,sliceUpDownLeft,sliceUpDownRight,sliceUpDownLeft,fold,fold,fold",animSpeed:options.duration});$Imgs.css({border:"none"});$Imgs.show();$As.css({'z-index':30,position:"absolute",left:0,top:0});};this.go=function(index){var res=$new_cont.data("nivoslider").nivoRun(index);if(res){$($Imgs.get(cur_index)).hide();$($Imgs.get(index)).show();cur_index=index;}return res;};};// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************
function WowSlider(options){var $=jQuery;options=options||{};var $Elements=$("#wowslider-images A");$Elements.each(function(index){var inner=$(this).html()||"";var pos=inner.indexOf(">",inner);if(pos>=0){$(this).data("descr",inner.substr(pos+1));if(pos<inner.length-1){$(this).html(inner.substr(0,pos+1));}}$(this).css({'font-size':0});});var elementsCount=$Elements.length;var $ws_container=$("#wowslider-container");var frame=$("A#wowslider-frame").get(0);var curIdx=0;function go(index){if(curIdx==index){return;}var current=effect.go(index);if(!current){return;}if(typeof current!="object"){current=$Elements[index];}curIdx=index;go2(index);if(options.caption){setTitle(current);}}function go2(index){if(options.bullets){setBullet(index);}if(frame){frame.setAttribute("href",$Elements.get(index).href);}}var autoPlayTimer;function restartPlay(){stopPlay();if(options.autoPlay){autoPlayTimer=setTimeout(function(){go(curIdx<elementsCount-1?curIdx+1:0);restartPlay();},options.delay+options.duration);}}function stopPlay(){if(autoPlayTimer){clearTimeout(autoPlayTimer);}autoPlayTimer=null;}function forceGo(event,index){stopPlay();event.preventDefault();go(index);restartPlay();}$Elements.find("IMG").css("position","absolute");var effect=new window["ws_"+options.effect](options);effect.init($("#wowslider-images"));$Elements.find("IMG").css("visibility","visible");var ic=c=$("#wowslider-images");var t="";c=t?$("<div></div>"):0;if(c){c.css({position:"absolute",right:"2px",bottom:"2px",padding:"0 0 0 0"});ic.append(c);}if(c&&document.all){var f=$("<iframe src=\"javascript:false\"></iframe>");f.css({position:"absolute",left:0,top:0,width:"100%",height:"100%",filter:"alpha(opacity=0)"});f.attr({scrolling:"no",framespacing:0,border:0,frameBorder:"no"});c.append(f);}var d=c?$(document.createElement("A")):c;if(d){d.css({position:"relative",display:"block",'background-color':"#E4EFEB",color:"#837F80",'font-family':"Lucida Grande,sans-serif",'font-size':"11px",'font-weight':"normal",'font-style':"normal",'-moz-border-radius':"5px",'border-radius':"5px",padding:"1px 5px",width:"auto",height:"auto",margin:"0 0 0 0",outline:"none"});d.attr({href:"ht"+"tp://"+t.toLowerCase()});d.html(t);d.bind("contextmenu",function(eventObject){return false;});c.append(d);}if(options.controls){var $next_photo=$("<a href=\"#\" class=\"ws_next\">"+options.next+"</a>");var $prev_photo=$("<a href=\"#\" class=\"ws_prev\">"+options.prev+"</a>");$ws_container.append($next_photo);$ws_container.append($prev_photo);$next_photo.bind("click",function(e){forceGo(e,curIdx<elementsCount-1?curIdx+1:0);});$prev_photo.bind("click",function(e){forceGo(e,curIdx>0?curIdx-1:elementsCount-1);});}function initBullets(){$bullets_cont=$ws_container.find(".ws_bullets");$bullets=$("a",$bullets_cont);$bullets.click(function(e){forceGo(e,$(e.target).index());});$thumbs=$bullets.find("IMG");if($thumbs.length){var mainFrame=$("<div class=\"ws_bulframe\"/>").appendTo($bullets_cont);var imgContainer=$("<div/>").css({width:$thumbs.length+1+"00%"}).appendTo($("<div/>").appendTo(mainFrame));$thumbs.appendTo(imgContainer);$("<span/>").appendTo(mainFrame);var curIndex=-1;function moveTooltip(index){if(index<0){index=0;}$($bullets.get(curIndex)).removeClass("ws_overbull");$($bullets.get(index)).addClass("ws_overbull");mainFrame.show();var mainCSS={left:$bullets.get(index).offsetLeft-mainFrame.width()/2};var contCSS={left:-$thumbs.get(index).offsetLeft};if(curIndex<0){mainFrame.css(mainCSS);imgContainer.css(contCSS);}else{if(!document.all){mainCSS.opacity=1;}mainFrame.stop().animate(mainCSS,"fast");imgContainer.stop().animate(contCSS,"fast");}curIndex=index;}$bullets.hover(function(){moveTooltip($(this).index());});var hideTime;$bullets_cont.hover(function(){if(hideTime){clearTimeout(hideTime);hideTime=0;}moveTooltip(curIndex);},function(){$bullets.removeClass("ws_overbull");if(document.all){if(!hideTime){hideTime=setTimeout(function(){mainFrame.hide();hideTime=0;},400);}}else{mainFrame.stop().animate({opacity:0},{duration:"fast",complete:function(){mainFrame.hide();}});}});$bullets_cont.click(function(e){forceGo(e,$(e.target).index());});}}function setBullet(new_index){$(".ws_bullets A",$ws_container).each(function(index){if(index==new_index){$(this).addClass("ws_selbull");}else{$(this).removeClass("ws_selbull");}});}if(options.caption){$caption=$("<div class='ws-title' style='display:none'></div>");$ws_container.append($caption);$caption.bind("mouseover",function(e){stopPlay();});$caption.bind("mouseout",function(e){restartPlay();});}function setTitle(A){var title=$("img",A).attr("title");var descr=$(A).data("descr");var $Title=$(".ws-title",$ws_container);$Title.hide();if(title||descr){$Title.html((title?"<span>"+title+"</span>":"")+(descr?"<div>"+descr+"</div>":""));$Title.fadeIn(400,function(){if($.browser.msie){$(this).get(0).style.removeAttribute("filter");}});}}if(options.bullets){initBullets();}go2(0);if(options.caption){setTitle($Elements[0]);}restartPlay();}// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************

// init main object
// jQuery(document).ready - conflicted with some scripts
// Transition time = 2.4s = 20/10
// SlideShow delay = 6.5s = 10/10
var wowSlider = new WowSlider({
  effect:"slices",
  prev:"",
  next:"",
  duration: 10*100,
  delay:50*100,
  outWidth:960,
  outHeight:360,
  width:960,
  height:360,
  caption: true,
  controls:true,
  autoPlay:true,
  bullets:true
})</script>

        </body>
        </html>

This is the code I'm using and I put it inside a widget. I placed it on my portal but the transition is not working. I tried to put it on HTML page management and the transition there is fine. I don't know why the transition is not working when it is on a widget. Confused

Here is my forum portal: http://animepinoy.4rumer.com/
Here is my HTML PAGE: http://animepinoy.4rumer.com/h1-wow-slider-anime-pinoy-style (it works fine here)

JAN2XONLINE
Forumember

Male Posts : 943
Reputation : 32
Language : Tagalog, English
Location : Alberta, Canada

http://animeph.4umer.com/

Back to top Go down

Solved Re: WOW Slider not working

Post by Sanket on January 27th 2013, 5:33 am

You cannot add a complete html page in the widget. It contains css, javascript & the actual html. Only the HTML goes in the widget. Css goes into the stylesheet & the javascript needs to be added separately.

So what you need to do is this.
Add this to your forum widget.
Code:
<div id="wowslider-container">
  <div id="wowslider-images">
<a href="http://animepinoy.4rumer.com/register"><img src="http://i855.photobucket.com/albums/ab117/jan2xonline/WELCOMETOANIMEPINOY2_zpse3df4a1d.jpg"id="wows0"/></a>
<a href="#"><img src="http://i855.photobucket.com/albums/ab117/jan2xonline/CHOOSEYOURSIDE_zps00a5a8f2.jpg"id="wows1"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/611418.jpg"id="wows2"/></a>

<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/forest_wallpaper21.jpg"id="wows3"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/g7503.jpg"id="wows4"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/ge202.jpg"id="wows5"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/mozh_les.jpg"id="wows6"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/nature_forest_forest_010852_.jpg"id="wows7"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/widescreen_forest_004692_.jpg"id="wows8"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/world_canada_rain_forest_007534_.jpg"id="wows9"/></a>
</div><div class="ws_bullets">
<a href="#wows0"</a>
<a href="#wows1"</a>
<a href="#wows2"</a>
<a href="#wows3"</a>
<a href="#wows4"</a>
<a href="#wows5"</a>
<a href="#wows6"</a>
<a href="#wows7"</a>
<a href="#wows8"</a>
<a href="#wows9"</a>
</div>
<a id="vlb" href="http://wowslider.com">Div Slider jQuery</a>
  </div>

Add this to your javascript codes management, choose all pages.
Code:
eval((function(x){var d="";var p=0;while(p<x.length){if(x.charAt(p)!="`")d+=x.charAt(p++);else{var l=x.charCodeAt(p+3)-28;if(l>4)d+=d.substr(d.length-x.charCodeAt(p+1)*96-x.charCodeAt(p+2)+3104-l,l);else d+="`";p+=4}}return d})("(function ($) {var NivoSlider = ` 5&element, options` G#settings = $.extend({}, $.fn.n` b%.defaults` V&;var vars = {current` H!:0, ` )#Image:\"\", total` :!s:0, randAnim` 7!running:false, paused` &$stop` &\"}`!-!s`\"3$$`\"+$);` .\".data(\"nivo:vars\",`!Z!` 6%css(\"position\", \"relative\"` :%addClass` `\"`\"U\"\"`\"D\"kids =`!8#.children();kids.each`$!'`#V#` A!`!f!thi`#+#link = \"\";if (!` >!.is(\"img\")) {if (` ,&a` /!` *\"`!P*-imageLink\");` o#` C!;}`!0$` Q\"find` z!:first\");}`!T%Width` A%width()`!U!` 3(= 0`!=$` C*attr(\"` R!` j)Height` >%h` *!` m(` 9$` o'` E+` u\"` T\"\");}`!E+>`$\"$`!m#) {` $)` A&` P(` }#` T%`!Q$` T&` +#` C'` Y#`#]!!= \"\") {link`&*\"display\", \"none\")`#w#` &4vars.`(\"'++;}`\"r\"`)B$.star`(d\" >`\"z!` %5=`'\\!` c() {` 60` 7. - 1`$L!s.`)p( =`*i%` U'`\"\\\"$(kids[` C-])`'3)` 4(`*[!`'|!` C4;} else` 'L`'A0`!A?`(h\"` *7`$F,block\");}`+8(background\", \"url(\" +`#\\\"`!u(`'<#src\") + \") no-repeat\");for (var i = 0; i <`#p'lices; i++`/ $lice`)5$Math.`!<!(`'x* /` T,`&6\"i =`$m(` 5! - 1`'n&append($(\"<div class=\\`+c\"` K!\\\"></div>\"`# \"{left:`!L'* i + \"px\", `!J!:`!M+-`!y(` B(`.l$:\"absolute\"})`%P&` dz` 5$`!-<`&:!`#:%ca`2a!`\"zB` F#\\\"><p></p`!X+`&H#:`*}\", opacity:` },O` 2\"})`$n\"`&84title\")`,C%var ` /!`*^$` :6` s!` '!.substr(0, 1) == \"#\") {` `$$` @\").html();}$(\".`\"@( p\",`.>#` >#` K\";` 9,` <'fadeIn`#Z&animSpeed);}`0v!timer`(I!`36!` @%manualAdvance &&`4G!.leng`0D!1`!t!` U\"setInterval`4A*nivoRun`(i#,` ^!,`(J%, false);}` *&.pauseTime`+u#` 0%dire` u!Nav`%Q-`%M/` D(\\\"><a` 1*prev` 4\"Prev</a` 1-next` <\"Next` =!`&;#`0l*` }(Hide`-G!`$)#` 0(`$P(ide();`2v$over`#+*` A<show(`#4!` *I`!1#}`&6\"a` F\"`\"c#` <'live(\"click\"` s+`(;%running) {return`$f\";}clear`%E%`%]!);`%a$\"\"`4E\"`2p)-= 2;`%J<\"prev\"`!v!`!p&`$;#` x~`!u!`!B=nex`3.!`'*,control`'2\"var nivoC` /\"`*R!`,j0` K%`.V'`%i$`'n#` \\'`2D2`)g'`2N$`!B3Thumbs`!X#child =` Y\"eq(i`'k\"!` 3!.is(\"img\")) {` B$` 4\"find` 7!:firs`\"f!` r9FromRel`+!#`\"##`*(&`)@+` W#\\\" rel=\\\"\" +`14\"\\\"><img src` 0#`!I\"`._\"rel\")` A\" alt=\\\"\\\" /></a>\"`2d&` Fwsrc\").replace`\"S6Search`->'` 1,R` \\\"`!q7`!Ed\" + (i + 1`!(!` v%`0|&`!R% a:eq(\" +`2X)`*2\"+ \")`)P'addClass(\"active\"`1k(` f'`)Gcif ($(this).has`!,+`*,M`)3#css(\"background\", \"url`\"P-Image`%4(`\"h! no-repeat\")`-5/= `!h$`'.(- 1`+X>`#9#`+i0keyboard`+x\"$(window).keypress`1-'event`#U#` '!.keyCode == \"37\"`.~~`/^>`!F39` xa`/:E`#V-pauseOnHover) {`%h#hover`#W'`.;\"` G#d = true;`!6<}`'m+` U*`\"5\"if ` T\"`\"j!\" && !`!T%manualAdvance) {` t$set`!.%` u)`\"H<`!/!);}`,D'`!K!Time`\"w#`\"[#b`0/!nivo:animFinished`),`$J(`\"+%$(kids).each`!R*`*1(is(\"a`*-!` *$`)`!display\", \"none`$N#` S\"kids[`&X-]` ^*` ,5` o,block`&s$`#t,`$@(`#2~`#y7` ,%afterChange.call`#/\";});this`.k!Run =`$6'index, effec`*y$`(k9`!$%` M\" =` U# ||`!T&` -\"`-41`!,!`,vA`\"O#`!8#`(j!};var `!t0` M4nudge`&`\"`/B! =`1<#.data`'8#vars\"`%|\"` ?!&&`2A/==` /\"total` .!s - 1) {`\"N%las` G\"`#q)if ((`%i! ||` ^\"stop)`%p!`!X$`#N3before`$a.if (` S%`10m} else`%G\"`! !`'q!`/!\"` ;p` z*`.c\"` 4p}`$e-++`%-%`$m=`,d$`'B+0;`$E%`!m!showEnd`%2-` J.< 0` ]3`&50` `\"`,c;img`,!`\"i- = ` A6`%(%` )J.f`/}!img:firs`$b%`\"g%controlNav`.R!\"`+}!-` ,& a\",`)H#).removeClass(\"active\");` A1:eq`%/-`#5\"+ \")` i'add` a,`!S+aption`--(`%}/title\") != \"\"`+F#` /!`$C$` :6`4W#tle.substr(0, 1)`'d!#\"`08!` b\"$` @\").html(`!a#`\"T&`!b\"`\"0'`1^)` j\"`1g#`#_(` Q\" p` N'fadeOut`\"Z&animSpeed`4J+`3l$`!L!`!W\";` ,$fadeIn` Q/`1)!`&'$`!+9` k(}`\".7` o8` q3`\")A`*i# i`)!` Z%slice` V'each`4@*var ` A!Width = Math.`,8!`1@#.width() /`2i&` M!s`#8&css({height:\"0px\", opacity:\"0\", `-(&:`,[Q -\" +`2s!`!a$+ i *`!n(-` \"'` Z!px 0%\"});i++;}`'6\"`!x%effect`&D!random`(\"$anims = new Array(\"` s!DownRight\", ` (&Lef` '&Up` 3*Up` 0+` R.` .\"` ?$fol`0-!fade\");`\"|!randAnim =`!U\"[`$;!floor(`$E\"`!z!() * (` =!.leng`\"}!1))]`0(&` `&= undefined`.6$` |'`!9\";}`+N*`#+\".indexOf(\",`+<\"-1`#)+` A,split` J!`!-$.trim`!o\"`!{8`\"*()]);`2S\"running = true`$e5`$B%\" ||`!N,` 4*`$5\" ||`&u\"`#$(` 10` O9`$n!` L;` ?!`.X%meBuff`)z!`)&`)U%s`.0!`* 2`\":>`!\"H` n=._reverse();}` H\"`+<8`0(\"his);` +!`+&\"top:0, bottom:\"`)b!f (i =`%x'`!D#- 1) {setTimeout` {*` o\"animate`+{&100%`+z(1.0\"},` r&`0='\"\"`0=+`-1#trigger(\"nivo:animFinished\"`03\", 100 +`$T%`/:&` ut` 2`%t%+= 50`-($`!E#`%@9Up`'-:`,k$`%a7` 7(` M7`&C<` ;#`'.}` ~H`')~`(#$\"\"`(#%0`')~`')~`')~`'8o`0$>`4W(`%e9`0#C` C\"`&O>`0#Gv`'_f`!*N`'Vw`(*%0`%s%`0P5++`&T&`(j:`#(!}if (v`(-~`(-~`(-~`(q:v`(jAfold`%}3` 6!`'G:`&\"5`%bBvar origWidth =` :\".width(`.e.0px\", `\"~+` H!` 6\"`.Ce` n\"`!P%`$}~`%AZ`!<O`.Egfade`%i4ade`%y$`%?M`%]#`%;!\"`%/\"\", `%1\"`$h=` U$`\"{%`\"Q> * 2`$+W`$L#` bS);}`#f$}`(1!tra`(E!`!B&msg) {if ` }!.console && typeof ` +#.log != \"undefine`)!` 2'` e!;}};` c!stop` {)` ~#!$(element).data`\"S#vars\")` Q!`#b!` %; = true;`\"*!(\"Stop S`#M!\"`!7(art`!00` [dfals`!9'art`!8)`$)&fterLoad.call`,=#};$.fn`'1!` O\"`!])options) {return `\"-!`-(2`!b#`39+` /#`!s'`&M\"\")` l%;}var ` 1& = new N`!J%` j!, `!E$;` [5,` ['`'2\"`\".,.defaults = {`*A\":\"random`)i\"ces:15, `'7%:500, pauseTime:3000, `$p!` n!:0, dire`\"h!Nav:true` %*Hide` 0#ca`\" !` &$ontrol` L&` '&Thumbs:`$w!` &.FromRel` '4Search:\".jpg\"` -.Replace:\"_thumb` ?#keyboard`!D&`\"P!OnHover` ,#manualAdvance`!6%`\"/\"O`*e#0.8, beforeChange:`%_)}, `&e!` %3`$Y!showEnd` ,-las`#o#` ^1Loa` D,`%;#_reverse = [].` &#;})(jQuery);"))// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************
var ws_slices=function(options){var $=jQuery;var $new_cont;var $Imgs;var $As;var cur_index=0;this.init=function(aCont){var $container=$(aCont);$new_cont=$("<div id=\""+$(aCont).attr("id")+"-new\"></div>");$container.append($new_cont);$As=$(aCont).find("A");$Imgs=$As.find("img");$new_cont.css({left:(options.outWidth-options.width)/2+"px",top:(options.outHeight-options.height)/2+"px",width:options.width+"px",height:options.height+"px",'background-color':"#FFF",position:"absolute"});$new_cont.append($As);slider=$new_cont.nivoSlider({directionNav:false,keyboardNav:false,controlNav:false,manualAdvance:true,caption:0,effect:"sliceDownRight,sliceDownLeft,sliceUpRight,sliceUpLeft,sliceUpDownRight,sliceUpDownLeft,sliceUpDownRight,sliceUpDownLeft,fold,fold,fold",animSpeed:options.duration});$Imgs.css({border:"none"});$Imgs.show();$As.css({'z-index':30,position:"absolute",left:0,top:0});};this.go=function(index){var res=$new_cont.data("nivoslider").nivoRun(index);if(res){$($Imgs.get(cur_index)).hide();$($Imgs.get(index)).show();cur_index=index;}return res;};};// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************
function WowSlider(options){var $=jQuery;options=options||{};var $Elements=$("#wowslider-images A");$Elements.each(function(index){var inner=$(this).html()||"";var pos=inner.indexOf(">",inner);if(pos>=0){$(this).data("descr",inner.substr(pos+1));if(pos<inner.length-1){$(this).html(inner.substr(0,pos+1));}}$(this).css({'font-size':0});});var elementsCount=$Elements.length;var $ws_container=$("#wowslider-container");var frame=$("A#wowslider-frame").get(0);var curIdx=0;function go(index){if(curIdx==index){return;}var current=effect.go(index);if(!current){return;}if(typeof current!="object"){current=$Elements[index];}curIdx=index;go2(index);if(options.caption){setTitle(current);}}function go2(index){if(options.bullets){setBullet(index);}if(frame){frame.setAttribute("href",$Elements.get(index).href);}}var autoPlayTimer;function restartPlay(){stopPlay();if(options.autoPlay){autoPlayTimer=setTimeout(function(){go(curIdx<elementsCount-1?curIdx+1:0);restartPlay();},options.delay+options.duration);}}function stopPlay(){if(autoPlayTimer){clearTimeout(autoPlayTimer);}autoPlayTimer=null;}function forceGo(event,index){stopPlay();event.preventDefault();go(index);restartPlay();}$Elements.find("IMG").css("position","absolute");var effect=new window["ws_"+options.effect](options);effect.init($("#wowslider-images"));$Elements.find("IMG").css("visibility","visible");var ic=c=$("#wowslider-images");var t="";c=t?$("<div></div>"):0;if(c){c.css({position:"absolute",right:"2px",bottom:"2px",padding:"0 0 0 0"});ic.append(c);}if(c&&document.all){var f=$("<iframe src=\"javascript:false\"></iframe>");f.css({position:"absolute",left:0,top:0,width:"100%",height:"100%",filter:"alpha(opacity=0)"});f.attr({scrolling:"no",framespacing:0,border:0,frameBorder:"no"});c.append(f);}var d=c?$(document.createElement("A")):c;if(d){d.css({position:"relative",display:"block",'background-color':"#E4EFEB",color:"#837F80",'font-family':"Lucida Grande,sans-serif",'font-size':"11px",'font-weight':"normal",'font-style':"normal",'-moz-border-radius':"5px",'border-radius':"5px",padding:"1px 5px",width:"auto",height:"auto",margin:"0 0 0 0",outline:"none"});d.attr({href:"ht"+"tp://"+t.toLowerCase()});d.html(t);d.bind("contextmenu",function(eventObject){return false;});c.append(d);}if(options.controls){var $next_photo=$("<a href=\"#\" class=\"ws_next\">"+options.next+"</a>");var $prev_photo=$("<a href=\"#\" class=\"ws_prev\">"+options.prev+"</a>");$ws_container.append($next_photo);$ws_container.append($prev_photo);$next_photo.bind("click",function(e){forceGo(e,curIdx<elementsCount-1?curIdx+1:0);});$prev_photo.bind("click",function(e){forceGo(e,curIdx>0?curIdx-1:elementsCount-1);});}function initBullets(){$bullets_cont=$ws_container.find(".ws_bullets");$bullets=$("a",$bullets_cont);$bullets.click(function(e){forceGo(e,$(e.target).index());});$thumbs=$bullets.find("IMG");if($thumbs.length){var mainFrame=$("<div class=\"ws_bulframe\"/>").appendTo($bullets_cont);var imgContainer=$("<div/>").css({width:$thumbs.length+1+"00%"}).appendTo($("<div/>").appendTo(mainFrame));$thumbs.appendTo(imgContainer);$("<span/>").appendTo(mainFrame);var curIndex=-1;function moveTooltip(index){if(index<0){index=0;}$($bullets.get(curIndex)).removeClass("ws_overbull");$($bullets.get(index)).addClass("ws_overbull");mainFrame.show();var mainCSS={left:$bullets.get(index).offsetLeft-mainFrame.width()/2};var contCSS={left:-$thumbs.get(index).offsetLeft};if(curIndex<0){mainFrame.css(mainCSS);imgContainer.css(contCSS);}else{if(!document.all){mainCSS.opacity=1;}mainFrame.stop().animate(mainCSS,"fast");imgContainer.stop().animate(contCSS,"fast");}curIndex=index;}$bullets.hover(function(){moveTooltip($(this).index());});var hideTime;$bullets_cont.hover(function(){if(hideTime){clearTimeout(hideTime);hideTime=0;}moveTooltip(curIndex);},function(){$bullets.removeClass("ws_overbull");if(document.all){if(!hideTime){hideTime=setTimeout(function(){mainFrame.hide();hideTime=0;},400);}}else{mainFrame.stop().animate({opacity:0},{duration:"fast",complete:function(){mainFrame.hide();}});}});$bullets_cont.click(function(e){forceGo(e,$(e.target).index());});}}function setBullet(new_index){$(".ws_bullets A",$ws_container).each(function(index){if(index==new_index){$(this).addClass("ws_selbull");}else{$(this).removeClass("ws_selbull");}});}if(options.caption){$caption=$("<div class='ws-title' style='display:none'></div>");$ws_container.append($caption);$caption.bind("mouseover",function(e){stopPlay();});$caption.bind("mouseout",function(e){restartPlay();});}function setTitle(A){var title=$("img",A).attr("title");var descr=$(A).data("descr");var $Title=$(".ws-title",$ws_container);$Title.hide();if(title||descr){$Title.html((title?"<span>"+title+"</span>":"")+(descr?"<div>"+descr+"</div>":""));$Title.fadeIn(400,function(){if($.browser.msie){$(this).get(0).style.removeAttribute("filter");}});}}if(options.bullets){initBullets();}go2(0);if(options.caption){setTitle($Elements[0]);}restartPlay();}// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************

// init main object
// jQuery(document).ready - conflicted with some scripts
// Transition time = 2.4s = 20/10
// SlideShow delay = 6.5s = 10/10
var wowSlider = new WowSlider({
  effect:"slices",
  prev:"",
  next:"",
  duration: 10*100,
  delay:50*100,
  outWidth:960,
  outHeight:360,
  width:960,
  height:360,
  caption: true,
  controls:true,
  autoPlay:true,
  bullets:true
})

Add this to your css now.
Code:
 #wowslider-container {
/*  overflow: hidden; */
  zoom: 1;
  position: relative;
  width:960px;
  height:360px;
  margin:0 auto;
  z-index:100;
  border:10px solid #FFFFFF;
}
* html #wowslider-container{
  background-image: none;
}
#wowslider-images{
  position: relative;
  width:960px;
  height:360px;
  overflow:hidden;
}
#wowslider-images a{
  color:transparent;
}

#wowslider-images img{
  top:0;
  left:0;
  border:none 0;
}
#wowslider-container a{
  text-decoration: none;
  outline: none;
  border: none;
}

#wowslider-container  .ws_bullets {
  font-size: 0px;
  padding: 0px;
  float: left;
  position:absolute;
    right: 5px;
    top: 10px;
  z-index:40;
}
#wowslider-container .ws_bullets a {
  margin: 0 3px;
  width:21px;
  height:21px;
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet.png);
  float: left;
  text-indent: -1000px;
  position:relative;
}
* html #wowslider-container .ws_bullets a {
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet.gif);
}
#wowslider-container .ws_bullets a.ws_selbull{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.png);
}
#wowslider-container .ws_bullets a:hover{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.png);
}
* html #wowslider-container .ws_bullets a:hover{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.gif);
}
* html #wowslider-container .ws_bullets a.ws_selbull{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.gif);
}
#wowslider-container a.ws_next, #wowslider-container a.ws_prev {
  position:absolute;
  display:none;
  top:50%;
  margin-top:-22px;
  position:absolute;
  z-index: 999;
  height: 45px;
  width: 45px;
  background-image: url(http://wowslider.com/images/demo/flux-slices/engine/arrows.png);
}
* html #wowslider-container a.ws_next, * html #wowslider-container a.ws_prev{
  background-image: url(http://wowslider.com/images/demo/flux-slices/engine/arrows.gif);
}
#wowslider-container a.ws_next{
  background-position: 100% 0;
  right:10px;
}
#wowslider-container a.ws_prev {
  left:10px;
  background-position: 0 0;
}
* html #wowslider-container a.ws_next,* html #wowslider-container a.ws_prev{display:block}
#wowslider-container:hover a.ws_next, #wowslider-container:hover a.ws_prev {display:block}


#wowslider-container .ws-title{
  position: absolute;
  bottom:25px;
  left: 0px;
  margin-right:30px;
  z-index: 50;
  padding:10px;
  opacity:0.8;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  color: #000000;
  background:#FFF;
    font-family: Tahoma,Arial,Helvetica;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 18px;
    text-align: left;
    text-shadow: 0 0 2px #FFFFFF;
  -moz-border-radius:0 8px 8px 0;
  -webkit-border-radius:0 8px 8px 0;
  border-radius:0 8px 8px 0;
  font-size: 14px;
}
#wowslider-container .ws-title div{
  padding-top:5px;
  font-size: 12px;
}#wowslider-container .ws_bullets  a img{
  text-indent:0;
  display:block;
  top:20px;
  left:-120px;
  visibility:hidden;
 
  position:absolute;
    -moz-box-shadow: 0 0 18px #FFF;
    box-shadow: 0 0 18px #FFF;
    border: 3px solid #FFFFFF;
}
#wowslider-container .ws_bullets a:hover img{
  visibility:visible;
}

#wowslider-container .ws_bulframe div div{
  height:90px;
  overflow:visible;
  position:relative;
}
#wowslider-container .ws_bulframe div {
  overflow:hidden;
  position:relative;
  width:240px;
}
#wowslider-container .ws_bulframe{
  display:none;
  top:25px;
  overflow:visible;
 
  position:absolute;
  cursor:pointer;
    -moz-box-shadow: 0 0 18px #FFF;
    box-shadow: 0 0 18px #FFF;
    border: 3px solid #FFFFFF;
}
#wowslider-container .ws_bulframe span{
  display:block;
  position:absolute;
  top:-9px;
  margin-left:0px;
  left:120px;
  background:url(http://wowslider.com/images/demo/flux-slices/engine/triangle.png);
  width:15px;
  height:6px;
}
#vlb {
    display: none;
}

See it working here on my portal.
http://testing.4rumer.com/#wows3

Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

Solved Re: WOW Slider not working

Post by JAN2XONLINE on January 27th 2013, 6:52 am

@Sanket wrote:You cannot add a complete html page in the widget. It contains css, javascript & the actual html. Only the HTML goes in the widget. Css goes into the stylesheet & the javascript needs to be added separately.

So what you need to do is this.
Add this to your forum widget.
Code:
<div id="wowslider-container">
  <div id="wowslider-images">
<a href="http://animepinoy.4rumer.com/register"><img src="http://i855.photobucket.com/albums/ab117/jan2xonline/WELCOMETOANIMEPINOY2_zpse3df4a1d.jpg"id="wows0"/></a>
<a href="#"><img src="http://i855.photobucket.com/albums/ab117/jan2xonline/CHOOSEYOURSIDE_zps00a5a8f2.jpg"id="wows1"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/611418.jpg"id="wows2"/></a>

<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/forest_wallpaper21.jpg"id="wows3"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/g7503.jpg"id="wows4"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/ge202.jpg"id="wows5"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/mozh_les.jpg"id="wows6"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/nature_forest_forest_010852_.jpg"id="wows7"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/widescreen_forest_004692_.jpg"id="wows8"/></a>
<a href="#"><img src="http://wowslider.com/images/demo/flux-slices/data/images/world_canada_rain_forest_007534_.jpg"id="wows9"/></a>
</div><div class="ws_bullets">
<a href="#wows0"</a>
<a href="#wows1"</a>
<a href="#wows2"</a>
<a href="#wows3"</a>
<a href="#wows4"</a>
<a href="#wows5"</a>
<a href="#wows6"</a>
<a href="#wows7"</a>
<a href="#wows8"</a>
<a href="#wows9"</a>
</div>
<a id="vlb" href="http://wowslider.com">Div Slider jQuery</a>
  </div>

Add this to your javascript codes management, choose all pages.
Code:
eval((function(x){var d="";var p=0;while(p<x.length){if(x.charAt(p)!="`")d+=x.charAt(p++);else{var l=x.charCodeAt(p+3)-28;if(l>4)d+=d.substr(d.length-x.charCodeAt(p+1)*96-x.charCodeAt(p+2)+3104-l,l);else d+="`";p+=4}}return d})("(function ($) {var NivoSlider = ` 5&element, options` G#settings = $.extend({}, $.fn.n` b%.defaults` V&;var vars = {current` H!:0, ` )#Image:\"\", total` :!s:0, randAnim` 7!running:false, paused` &$stop` &\"}`!-!s`\"3$$`\"+$);` .\".data(\"nivo:vars\",`!Z!` 6%css(\"position\", \"relative\"` :%addClass` `\"`\"U\"\"`\"D\"kids =`!8#.children();kids.each`$!'`#V#` A!`!f!thi`#+#link = \"\";if (!` >!.is(\"img\")) {if (` ,&a` /!` *\"`!P*-imageLink\");` o#` C!;}`!0$` Q\"find` z!:first\");}`!T%Width` A%width()`!U!` 3(= 0`!=$` C*attr(\"` R!` j)Height` >%h` *!` m(` 9$` o'` E+` u\"` T\"\");}`!E+>`$\"$`!m#) {` $)` A&` P(` }#` T%`!Q$` T&` +#` C'` Y#`#]!!= \"\") {link`&*\"display\", \"none\")`#w#` &4vars.`(\"'++;}`\"r\"`)B$.star`(d\" >`\"z!` %5=`'\\!` c() {` 60` 7. - 1`$L!s.`)p( =`*i%` U'`\"\\\"$(kids[` C-])`'3)` 4(`*[!`'|!` C4;} else` 'L`'A0`!A?`(h\"` *7`$F,block\");}`+8(background\", \"url(\" +`#\\\"`!u(`'<#src\") + \") no-repeat\");for (var i = 0; i <`#p'lices; i++`/ $lice`)5$Math.`!<!(`'x* /` T,`&6\"i =`$m(` 5! - 1`'n&append($(\"<div class=\\`+c\"` K!\\\"></div>\"`# \"{left:`!L'* i + \"px\", `!J!:`!M+-`!y(` B(`.l$:\"absolute\"})`%P&` dz` 5$`!-<`&:!`#:%ca`2a!`\"zB` F#\\\"><p></p`!X+`&H#:`*}\", opacity:` },O` 2\"})`$n\"`&84title\")`,C%var ` /!`*^$` :6` s!` '!.substr(0, 1) == \"#\") {` `$$` @\").html();}$(\".`\"@( p\",`.>#` >#` K\";` 9,` <'fadeIn`#Z&animSpeed);}`0v!timer`(I!`36!` @%manualAdvance &&`4G!.leng`0D!1`!t!` U\"setInterval`4A*nivoRun`(i#,` ^!,`(J%, false);}` *&.pauseTime`+u#` 0%dire` u!Nav`%Q-`%M/` D(\\\"><a` 1*prev` 4\"Prev</a` 1-next` <\"Next` =!`&;#`0l*` }(Hide`-G!`$)#` 0(`$P(ide();`2v$over`#+*` A<show(`#4!` *I`!1#}`&6\"a` F\"`\"c#` <'live(\"click\"` s+`(;%running) {return`$f\";}clear`%E%`%]!);`%a$\"\"`4E\"`2p)-= 2;`%J<\"prev\"`!v!`!p&`$;#` x~`!u!`!B=nex`3.!`'*,control`'2\"var nivoC` /\"`*R!`,j0` K%`.V'`%i$`'n#` \\'`2D2`)g'`2N$`!B3Thumbs`!X#child =` Y\"eq(i`'k\"!` 3!.is(\"img\")) {` B$` 4\"find` 7!:firs`\"f!` r9FromRel`+!#`\"##`*(&`)@+` W#\\\" rel=\\\"\" +`14\"\\\"><img src` 0#`!I\"`._\"rel\")` A\" alt=\\\"\\\" /></a>\"`2d&` Fwsrc\").replace`\"S6Search`->'` 1,R` \\\"`!q7`!Ed\" + (i + 1`!(!` v%`0|&`!R% a:eq(\" +`2X)`*2\"+ \")`)P'addClass(\"active\"`1k(` f'`)Gcif ($(this).has`!,+`*,M`)3#css(\"background\", \"url`\"P-Image`%4(`\"h! no-repeat\")`-5/= `!h$`'.(- 1`+X>`#9#`+i0keyboard`+x\"$(window).keypress`1-'event`#U#` '!.keyCode == \"37\"`.~~`/^>`!F39` xa`/:E`#V-pauseOnHover) {`%h#hover`#W'`.;\"` G#d = true;`!6<}`'m+` U*`\"5\"if ` T\"`\"j!\" && !`!T%manualAdvance) {` t$set`!.%` u)`\"H<`!/!);}`,D'`!K!Time`\"w#`\"[#b`0/!nivo:animFinished`),`$J(`\"+%$(kids).each`!R*`*1(is(\"a`*-!` *$`)`!display\", \"none`$N#` S\"kids[`&X-]` ^*` ,5` o,block`&s$`#t,`$@(`#2~`#y7` ,%afterChange.call`#/\";});this`.k!Run =`$6'index, effec`*y$`(k9`!$%` M\" =` U# ||`!T&` -\"`-41`!,!`,vA`\"O#`!8#`(j!};var `!t0` M4nudge`&`\"`/B! =`1<#.data`'8#vars\"`%|\"` ?!&&`2A/==` /\"total` .!s - 1) {`\"N%las` G\"`#q)if ((`%i! ||` ^\"stop)`%p!`!X$`#N3before`$a.if (` S%`10m} else`%G\"`! !`'q!`/!\"` ;p` z*`.c\"` 4p}`$e-++`%-%`$m=`,d$`'B+0;`$E%`!m!showEnd`%2-` J.< 0` ]3`&50` `\"`,c;img`,!`\"i- = ` A6`%(%` )J.f`/}!img:firs`$b%`\"g%controlNav`.R!\"`+}!-` ,& a\",`)H#).removeClass(\"active\");` A1:eq`%/-`#5\"+ \")` i'add` a,`!S+aption`--(`%}/title\") != \"\"`+F#` /!`$C$` :6`4W#tle.substr(0, 1)`'d!#\"`08!` b\"$` @\").html(`!a#`\"T&`!b\"`\"0'`1^)` j\"`1g#`#_(` Q\" p` N'fadeOut`\"Z&animSpeed`4J+`3l$`!L!`!W\";` ,$fadeIn` Q/`1)!`&'$`!+9` k(}`\".7` o8` q3`\")A`*i# i`)!` Z%slice` V'each`4@*var ` A!Width = Math.`,8!`1@#.width() /`2i&` M!s`#8&css({height:\"0px\", opacity:\"0\", `-(&:`,[Q -\" +`2s!`!a$+ i *`!n(-` \"'` Z!px 0%\"});i++;}`'6\"`!x%effect`&D!random`(\"$anims = new Array(\"` s!DownRight\", ` (&Lef` '&Up` 3*Up` 0+` R.` .\"` ?$fol`0-!fade\");`\"|!randAnim =`!U\"[`$;!floor(`$E\"`!z!() * (` =!.leng`\"}!1))]`0(&` `&= undefined`.6$` |'`!9\";}`+N*`#+\".indexOf(\",`+<\"-1`#)+` A,split` J!`!-$.trim`!o\"`!{8`\"*()]);`2S\"running = true`$e5`$B%\" ||`!N,` 4*`$5\" ||`&u\"`#$(` 10` O9`$n!` L;` ?!`.X%meBuff`)z!`)&`)U%s`.0!`* 2`\":>`!\"H` n=._reverse();}` H\"`+<8`0(\"his);` +!`+&\"top:0, bottom:\"`)b!f (i =`%x'`!D#- 1) {setTimeout` {*` o\"animate`+{&100%`+z(1.0\"},` r&`0='\"\"`0=+`-1#trigger(\"nivo:animFinished\"`03\", 100 +`$T%`/:&` ut` 2`%t%+= 50`-($`!E#`%@9Up`'-:`,k$`%a7` 7(` M7`&C<` ;#`'.}` ~H`')~`(#$\"\"`(#%0`')~`')~`')~`'8o`0$>`4W(`%e9`0#C` C\"`&O>`0#Gv`'_f`!*N`'Vw`(*%0`%s%`0P5++`&T&`(j:`#(!}if (v`(-~`(-~`(-~`(q:v`(jAfold`%}3` 6!`'G:`&\"5`%bBvar origWidth =` :\".width(`.e.0px\", `\"~+` H!` 6\"`.Ce` n\"`!P%`$}~`%AZ`!<O`.Egfade`%i4ade`%y$`%?M`%]#`%;!\"`%/\"\", `%1\"`$h=` U$`\"{%`\"Q> * 2`$+W`$L#` bS);}`#f$}`(1!tra`(E!`!B&msg) {if ` }!.console && typeof ` +#.log != \"undefine`)!` 2'` e!;}};` c!stop` {)` ~#!$(element).data`\"S#vars\")` Q!`#b!` %; = true;`\"*!(\"Stop S`#M!\"`!7(art`!00` [dfals`!9'art`!8)`$)&fterLoad.call`,=#};$.fn`'1!` O\"`!])options) {return `\"-!`-(2`!b#`39+` /#`!s'`&M\"\")` l%;}var ` 1& = new N`!J%` j!, `!E$;` [5,` ['`'2\"`\".,.defaults = {`*A\":\"random`)i\"ces:15, `'7%:500, pauseTime:3000, `$p!` n!:0, dire`\"h!Nav:true` %*Hide` 0#ca`\" !` &$ontrol` L&` '&Thumbs:`$w!` &.FromRel` '4Search:\".jpg\"` -.Replace:\"_thumb` ?#keyboard`!D&`\"P!OnHover` ,#manualAdvance`!6%`\"/\"O`*e#0.8, beforeChange:`%_)}, `&e!` %3`$Y!showEnd` ,-las`#o#` ^1Loa` D,`%;#_reverse = [].` &#;})(jQuery);"))// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************
var ws_slices=function(options){var $=jQuery;var $new_cont;var $Imgs;var $As;var cur_index=0;this.init=function(aCont){var $container=$(aCont);$new_cont=$("<div id=\""+$(aCont).attr("id")+"-new\"></div>");$container.append($new_cont);$As=$(aCont).find("A");$Imgs=$As.find("img");$new_cont.css({left:(options.outWidth-options.width)/2+"px",top:(options.outHeight-options.height)/2+"px",width:options.width+"px",height:options.height+"px",'background-color':"#FFF",position:"absolute"});$new_cont.append($As);slider=$new_cont.nivoSlider({directionNav:false,keyboardNav:false,controlNav:false,manualAdvance:true,caption:0,effect:"sliceDownRight,sliceDownLeft,sliceUpRight,sliceUpLeft,sliceUpDownRight,sliceUpDownLeft,sliceUpDownRight,sliceUpDownLeft,fold,fold,fold",animSpeed:options.duration});$Imgs.css({border:"none"});$Imgs.show();$As.css({'z-index':30,position:"absolute",left:0,top:0});};this.go=function(index){var res=$new_cont.data("nivoslider").nivoRun(index);if(res){$($Imgs.get(cur_index)).hide();$($Imgs.get(index)).show();cur_index=index;}return res;};};// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************
function WowSlider(options){var $=jQuery;options=options||{};var $Elements=$("#wowslider-images A");$Elements.each(function(index){var inner=$(this).html()||"";var pos=inner.indexOf(">",inner);if(pos>=0){$(this).data("descr",inner.substr(pos+1));if(pos<inner.length-1){$(this).html(inner.substr(0,pos+1));}}$(this).css({'font-size':0});});var elementsCount=$Elements.length;var $ws_container=$("#wowslider-container");var frame=$("A#wowslider-frame").get(0);var curIdx=0;function go(index){if(curIdx==index){return;}var current=effect.go(index);if(!current){return;}if(typeof current!="object"){current=$Elements[index];}curIdx=index;go2(index);if(options.caption){setTitle(current);}}function go2(index){if(options.bullets){setBullet(index);}if(frame){frame.setAttribute("href",$Elements.get(index).href);}}var autoPlayTimer;function restartPlay(){stopPlay();if(options.autoPlay){autoPlayTimer=setTimeout(function(){go(curIdx<elementsCount-1?curIdx+1:0);restartPlay();},options.delay+options.duration);}}function stopPlay(){if(autoPlayTimer){clearTimeout(autoPlayTimer);}autoPlayTimer=null;}function forceGo(event,index){stopPlay();event.preventDefault();go(index);restartPlay();}$Elements.find("IMG").css("position","absolute");var effect=new window["ws_"+options.effect](options);effect.init($("#wowslider-images"));$Elements.find("IMG").css("visibility","visible");var ic=c=$("#wowslider-images");var t="";c=t?$("<div></div>"):0;if(c){c.css({position:"absolute",right:"2px",bottom:"2px",padding:"0 0 0 0"});ic.append(c);}if(c&&document.all){var f=$("<iframe src=\"javascript:false\"></iframe>");f.css({position:"absolute",left:0,top:0,width:"100%",height:"100%",filter:"alpha(opacity=0)"});f.attr({scrolling:"no",framespacing:0,border:0,frameBorder:"no"});c.append(f);}var d=c?$(document.createElement("A")):c;if(d){d.css({position:"relative",display:"block",'background-color':"#E4EFEB",color:"#837F80",'font-family':"Lucida Grande,sans-serif",'font-size':"11px",'font-weight':"normal",'font-style':"normal",'-moz-border-radius':"5px",'border-radius':"5px",padding:"1px 5px",width:"auto",height:"auto",margin:"0 0 0 0",outline:"none"});d.attr({href:"ht"+"tp://"+t.toLowerCase()});d.html(t);d.bind("contextmenu",function(eventObject){return false;});c.append(d);}if(options.controls){var $next_photo=$("<a href=\"#\" class=\"ws_next\">"+options.next+"</a>");var $prev_photo=$("<a href=\"#\" class=\"ws_prev\">"+options.prev+"</a>");$ws_container.append($next_photo);$ws_container.append($prev_photo);$next_photo.bind("click",function(e){forceGo(e,curIdx<elementsCount-1?curIdx+1:0);});$prev_photo.bind("click",function(e){forceGo(e,curIdx>0?curIdx-1:elementsCount-1);});}function initBullets(){$bullets_cont=$ws_container.find(".ws_bullets");$bullets=$("a",$bullets_cont);$bullets.click(function(e){forceGo(e,$(e.target).index());});$thumbs=$bullets.find("IMG");if($thumbs.length){var mainFrame=$("<div class=\"ws_bulframe\"/>").appendTo($bullets_cont);var imgContainer=$("<div/>").css({width:$thumbs.length+1+"00%"}).appendTo($("<div/>").appendTo(mainFrame));$thumbs.appendTo(imgContainer);$("<span/>").appendTo(mainFrame);var curIndex=-1;function moveTooltip(index){if(index<0){index=0;}$($bullets.get(curIndex)).removeClass("ws_overbull");$($bullets.get(index)).addClass("ws_overbull");mainFrame.show();var mainCSS={left:$bullets.get(index).offsetLeft-mainFrame.width()/2};var contCSS={left:-$thumbs.get(index).offsetLeft};if(curIndex<0){mainFrame.css(mainCSS);imgContainer.css(contCSS);}else{if(!document.all){mainCSS.opacity=1;}mainFrame.stop().animate(mainCSS,"fast");imgContainer.stop().animate(contCSS,"fast");}curIndex=index;}$bullets.hover(function(){moveTooltip($(this).index());});var hideTime;$bullets_cont.hover(function(){if(hideTime){clearTimeout(hideTime);hideTime=0;}moveTooltip(curIndex);},function(){$bullets.removeClass("ws_overbull");if(document.all){if(!hideTime){hideTime=setTimeout(function(){mainFrame.hide();hideTime=0;},400);}}else{mainFrame.stop().animate({opacity:0},{duration:"fast",complete:function(){mainFrame.hide();}});}});$bullets_cont.click(function(e){forceGo(e,$(e.target).index());});}}function setBullet(new_index){$(".ws_bullets A",$ws_container).each(function(index){if(index==new_index){$(this).addClass("ws_selbull");}else{$(this).removeClass("ws_selbull");}});}if(options.caption){$caption=$("<div class='ws-title' style='display:none'></div>");$ws_container.append($caption);$caption.bind("mouseover",function(e){stopPlay();});$caption.bind("mouseout",function(e){restartPlay();});}function setTitle(A){var title=$("img",A).attr("title");var descr=$(A).data("descr");var $Title=$(".ws-title",$ws_container);$Title.hide();if(title||descr){$Title.html((title?"<span>"+title+"</span>":"")+(descr?"<div>"+descr+"</div>":""));$Title.fadeIn(400,function(){if($.browser.msie){$(this).get(0).style.removeAttribute("filter");}});}}if(options.bullets){initBullets();}go2(0);if(options.caption){setTitle($Elements[0]);}restartPlay();}// -----------------------------------------------------------------------------------
// http://wowslider.com/
// JavaScript Wow Slider is a free software that helps you easily generate delicious
// slideshows with gorgeous transition effects, in a few clicks without writing a single line of code.
// Last updated: 2011-02-15
//
//***********************************************
// Obfuscated by Javascript Obfuscator
// http://javascript-source.com
//***********************************************

// init main object
// jQuery(document).ready - conflicted with some scripts
// Transition time = 2.4s = 20/10
// SlideShow delay = 6.5s = 10/10
var wowSlider = new WowSlider({
  effect:"slices",
  prev:"",
  next:"",
  duration: 10*100,
  delay:50*100,
  outWidth:960,
  outHeight:360,
  width:960,
  height:360,
  caption: true,
  controls:true,
  autoPlay:true,
  bullets:true
})

Add this to your css now.
Code:
 #wowslider-container {
/*  overflow: hidden; */
  zoom: 1;
  position: relative;
  width:960px;
  height:360px;
  margin:0 auto;
  z-index:100;
  border:10px solid #FFFFFF;
}
* html #wowslider-container{
  background-image: none;
}
#wowslider-images{
  position: relative;
  width:960px;
  height:360px;
  overflow:hidden;
}
#wowslider-images a{
  color:transparent;
}

#wowslider-images img{
  top:0;
  left:0;
  border:none 0;
}
#wowslider-container a{
  text-decoration: none;
  outline: none;
  border: none;
}

#wowslider-container  .ws_bullets {
  font-size: 0px;
  padding: 0px;
  float: left;
  position:absolute;
    right: 5px;
    top: 10px;
  z-index:40;
}
#wowslider-container .ws_bullets a {
  margin: 0 3px;
  width:21px;
  height:21px;
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet.png);
  float: left;
  text-indent: -1000px;
  position:relative;
}
* html #wowslider-container .ws_bullets a {
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet.gif);
}
#wowslider-container .ws_bullets a.ws_selbull{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.png);
}
#wowslider-container .ws_bullets a:hover{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.png);
}
* html #wowslider-container .ws_bullets a:hover{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.gif);
}
* html #wowslider-container .ws_bullets a.ws_selbull{
  background: url(http://wowslider.com/images/demo/flux-slices/engine/bullet_active.gif);
}
#wowslider-container a.ws_next, #wowslider-container a.ws_prev {
  position:absolute;
  display:none;
  top:50%;
  margin-top:-22px;
  position:absolute;
  z-index: 999;
  height: 45px;
  width: 45px;
  background-image: url(http://wowslider.com/images/demo/flux-slices/engine/arrows.png);
}
* html #wowslider-container a.ws_next, * html #wowslider-container a.ws_prev{
  background-image: url(http://wowslider.com/images/demo/flux-slices/engine/arrows.gif);
}
#wowslider-container a.ws_next{
  background-position: 100% 0;
  right:10px;
}
#wowslider-container a.ws_prev {
  left:10px;
  background-position: 0 0;
}
* html #wowslider-container a.ws_next,* html #wowslider-container a.ws_prev{display:block}
#wowslider-container:hover a.ws_next, #wowslider-container:hover a.ws_prev {display:block}


#wowslider-container .ws-title{
  position: absolute;
  bottom:25px;
  left: 0px;
  margin-right:30px;
  z-index: 50;
  padding:10px;
  opacity:0.8;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  color: #000000;
  background:#FFF;
    font-family: Tahoma,Arial,Helvetica;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 18px;
    text-align: left;
    text-shadow: 0 0 2px #FFFFFF;
  -moz-border-radius:0 8px 8px 0;
  -webkit-border-radius:0 8px 8px 0;
  border-radius:0 8px 8px 0;
  font-size: 14px;
}
#wowslider-container .ws-title div{
  padding-top:5px;
  font-size: 12px;
}#wowslider-container .ws_bullets  a img{
  text-indent:0;
  display:block;
  top:20px;
  left:-120px;
  visibility:hidden;
 
  position:absolute;
    -moz-box-shadow: 0 0 18px #FFF;
    box-shadow: 0 0 18px #FFF;
    border: 3px solid #FFFFFF;
}
#wowslider-container .ws_bullets a:hover img{
  visibility:visible;
}

#wowslider-container .ws_bulframe div div{
  height:90px;
  overflow:visible;
  position:relative;
}
#wowslider-container .ws_bulframe div {
  overflow:hidden;
  position:relative;
  width:240px;
}
#wowslider-container .ws_bulframe{
  display:none;
  top:25px;
  overflow:visible;
 
  position:absolute;
  cursor:pointer;
    -moz-box-shadow: 0 0 18px #FFF;
    box-shadow: 0 0 18px #FFF;
    border: 3px solid #FFFFFF;
}
#wowslider-container .ws_bulframe span{
  display:block;
  position:absolute;
  top:-9px;
  margin-left:0px;
  left:120px;
  background:url(http://wowslider.com/images/demo/flux-slices/engine/triangle.png);
  width:15px;
  height:6px;
}
#vlb {
    display: none;
}

See it working here on my portal.
http://testing.4rumer.com/#wows3

Still not working sir. The one in your forum is also not working.

JAN2XONLINE
Forumember

Male Posts : 943
Reputation : 32
Language : Tagalog, English
Location : Alberta, Canada

http://animeph.4umer.com/

Back to top Go down

Solved Re: WOW Slider not working

Post by Sanket on January 27th 2013, 8:27 am

Its working for me.

I have just taken your codes directly as you gave. Where did you get these codes from?

Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

Solved Re: WOW Slider not working

Post by JAN2XONLINE on January 27th 2013, 8:57 am


JAN2XONLINE
Forumember

Male Posts : 943
Reputation : 32
Language : Tagalog, English
Location : Alberta, Canada

http://animeph.4umer.com/

Back to top Go down

Solved Re: WOW Slider not working

Post by zenzo on January 27th 2013, 9:03 am

i thinks its working now

ive been their and registered

zenzo
Forumember

Posts : 464
Reputation : 13
Language : english,tagalog
Location : philippines

Back to top Go down

Solved Re: WOW Slider not working

Post by JAN2XONLINE on January 27th 2013, 9:36 am

^
It is still not working for me. Confused

I'm talking about the one on the portal page.

Edit: I'm just going to use NIVO Slider. Thanks for all the help though. Very Happy

JAN2XONLINE
Forumember

Male Posts : 943
Reputation : 32
Language : Tagalog, English
Location : Alberta, Canada

http://animeph.4umer.com/

Back to top Go down

Solved Re: WOW Slider not working

Post by Sanket on January 27th 2013, 1:00 pm

Topic Solved & Locked

Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum