1<!-- EASING JS --> 

2<script type="text/javascript"> 

3/* 

4 * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/ 

5 * 

6 * Uses the built in easing capabilities added In jQuery 1.1 

7 * to offer multiple easing options 

8 * 

9 * TERMS OF USE - jQuery Easing 

10 * 

11 * Open source under the BSD License. 

12 * 

13 * Copyright © 2008 George McGinley Smith 

14 * All rights reserved. 

15 * 

16 * Redistribution and use in source and binary forms, with or without modification, 

17 * are permitted provided that the following conditions are met: 

18 * 

19 * Redistributions of source code must retain the above copyright notice, this list of 

20 * conditions and the following disclaimer. 

21 * Redistributions in binary form must reproduce the above copyright notice, this list 

22 * of conditions and the following disclaimer in the documentation and/or other materials 

23 * provided with the distribution. 

24 * 

25 * Neither the name of the author nor the names of contributors may be used to endorse 

26 * or promote products derived from this software without specific prior written permission. 

27 * 

28 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY 

29 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF 

30 * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE 

31 *  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, 

32 *  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE 

33 *  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED 

34 * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING 

35 *  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED 

36 * OF THE POSSIBILITY OF SUCH DAMAGE. 

37 * 

38*/ 

39 

40// t: current time, b: begInnIng value, c: change In value, d: duration 

41jQuery.easing['jswing'] = jQuery.easing['swing']; 

42 

43jQuery.extend( jQuery.easing, 

44{ 

45        def: 'easeOutQuad', 

46        swing: function (x, t, b, c, d) { 

47                //alert(jQuery.easing.default); 

48                return jQuery.easing[jQuery.easing.def](x, t, b, c, d); 

49        }, 

50        easeInQuad: function (x, t, b, c, d) { 

51                return c*(t/=d)*t + b; 

52        }, 

53        easeOutQuad: function (x, t, b, c, d) { 

54                return -c *(t/=d)*(t-2) + b; 

55        }, 

56        easeInOutQuad: function (x, t, b, c, d) { 

57                if ((t/=d/2) < 1) return c/2*t*t + b; 

58                return -c/2 * ((--t)*(t-2) - 1) + b; 

59        }, 

60        easeInCubic: function (x, t, b, c, d) { 

61                return c*(t/=d)*t*t + b; 

62        }, 

63        easeOutCubic: function (x, t, b, c, d) { 

64                return c*((t=t/d-1)*t*t + 1) + b; 

65        }, 

66        easeInOutCubic: function (x, t, b, c, d) { 

67                if ((t/=d/2) < 1) return c/2*t*t*t + b; 

68                return c/2*((t-=2)*t*t + 2) + b; 

69        }, 

70        easeInQuart: function (x, t, b, c, d) { 

71                return c*(t/=d)*t*t*t + b; 

72        }, 

73        easeOutQuart: function (x, t, b, c, d) { 

74                return -c * ((t=t/d-1)*t*t*t - 1) + b; 

75        }, 

76        easeInOutQuart: function (x, t, b, c, d) { 

77                if ((t/=d/2) < 1) return c/2*t*t*t*t + b; 

78                return -c/2 * ((t-=2)*t*t*t - 2) + b; 

79        }, 

80        easeInQuint: function (x, t, b, c, d) { 

81                return c*(t/=d)*t*t*t*t + b; 

82        }, 

83        easeOutQuint: function (x, t, b, c, d) { 

84                return c*((t=t/d-1)*t*t*t*t + 1) + b; 

85        }, 

86        easeInOutQuint: function (x, t, b, c, d) { 

87                if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b; 

88                return c/2*((t-=2)*t*t*t*t + 2) + b; 

89        }, 

90        easeInSine: function (x, t, b, c, d) { 

91                return -c * Math.cos(t/d * (Math.PI/2)) + c + b; 

92        }, 

93        easeOutSine: function (x, t, b, c, d) { 

94                return c * Math.sin(t/d * (Math.PI/2)) + b; 

95        }, 

96        easeInOutSine: function (x, t, b, c, d) { 

97                return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b; 

98        }, 

99        easeInExpo: function (x, t, b, c, d) { 

100                return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; 

101        }, 

102        easeOutExpo: function (x, t, b, c, d) { 

103                return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; 

104        }, 

105        easeInOutExpo: function (x, t, b, c, d) { 

106                if (t==0) return b; 

107                if (t==d) return b+c; 

108                if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; 

109                return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; 

110        }, 

111        easeInCirc: function (x, t, b, c, d) { 

112                return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b; 

113        }, 

114        easeOutCirc: function (x, t, b, c, d) { 

115                return c * Math.sqrt(1 - (t=t/d-1)*t) + b; 

116        }, 

117        easeInOutCirc: function (x, t, b, c, d) { 

118                if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b; 

119                return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b; 

120        }, 

121        easeInElastic: function (x, t, b, c, d) { 

122                var s=1.70158;var p=0;var a=c; 

123                if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3; 

124                if (a < Math.abs(c)) { a=c; var s=p/4; } 

125                else var s = p/(2*Math.PI) * Math.asin (c/a); 

126                return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; 

127        }, 

128        easeOutElastic: function (x, t, b, c, d) { 

129                var s=1.70158;var p=0;var a=c; 

130                if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3; 

131                if (a < Math.abs(c)) { a=c; var s=p/4; } 

132                else var s = p/(2*Math.PI) * Math.asin (c/a); 

133                return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b; 

134        }, 

135        easeInOutElastic: function (x, t, b, c, d) { 

136                var s=1.70158;var p=0;var a=c; 

137                if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5); 

138                if (a < Math.abs(c)) { a=c; var s=p/4; } 

139                else var s = p/(2*Math.PI) * Math.asin (c/a); 

140                if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b; 

141                return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b; 

142        }, 

143        easeInBack: function (x, t, b, c, d, s) { 

144                if (s == undefined) s = 1.70158; 

145                return c*(t/=d)*t*((s+1)*t - s) + b; 

146        }, 

147        easeOutBack: function (x, t, b, c, d, s) { 

148                if (s == undefined) s = 1.70158; 

149                return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b; 

150        }, 

151        easeInOutBack: function (x, t, b, c, d, s) { 

152                if (s == undefined) s = 1.70158; 

153                if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b; 

154                return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b; 

155        }, 

156        easeInBounce: function (x, t, b, c, d) { 

157                return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b; 

158        }, 

159        easeOutBounce: function (x, t, b, c, d) { 

160                if ((t/=d) < (1/2.75)) { 

161                        return c*(7.5625*t*t) + b; 

162                } else if (t < (2/2.75)) { 

163                        return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b; 

164                } else if (t < (2.5/2.75)) { 

165                        return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b; 

166                } else { 

167                        return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b; 

168                } 

169        }, 

170        easeInOutBounce: function (x, t, b, c, d) { 

171                if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b; 

172                return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b; 

173        } 

174}); 

175 

176/* 

177 * 

178 * TERMS OF USE - EASING EQUATIONS 

179 * 

180 * Open source under the BSD License. 

181 * 

182 * Copyright Ã?© 2001 Robert Penner 

183 * All rights reserved. 

184 * 

185 * Redistribution and use in source and binary forms, with or without modification, 

186 * are permitted provided that the following conditions are met: 

187 * 

188 * Redistributions of source code must retain the above copyright notice, this list of 

189 * conditions and the following disclaimer. 

190 * Redistributions in binary form must reproduce the above copyright notice, this list 

191 * of conditions and the following disclaimer in the documentation and/or other materials 

192 * provided with the distribution. 

193 * 

194 * Neither the name of the author nor the names of contributors may be used to endorse 

195 * or promote products derived from this software without specific prior written permission. 

196 * 

197 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY 

198 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF 

199 * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE 

200 *  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, 

201 *  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE 

202 *  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED 

203 * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING 

204 *  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED 

205 * OF THE POSSIBILITY OF SUCH DAMAGE. 

206 * 

207 */ 

208</script> 

209 

210 

211<!-- CODA-SLIDER JS --> 

212<script type="text/javascript"> 

213/* 

214        jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider 

215        Copyright (c) 2009 Niall Doherty 

216        This plugin available for use in all personal or commercial projects under both MIT and GPL licenses. 

217*/ 

218 

219jQuery(function(){ 

220        // Remove the coda-slider-no-js class from the body 

221        jQuery("body").removeClass("coda-slider-no-js"); 

222        // Preloader 

223        //jQuery(".coda-slider").children('.panel').hide().end().prepend('<p class="loading">Loading...<br /><img src="images/ajax-loader.gif" alt="loading..." /></p>'); 

224}); 

225 

226var sliderCount = 1; 

227 

228jQuery.fn.codaSlider = function(settings) { 

229 

230        settings = jQuery.extend({ 

231                autoHeight: true, 

232                autoHeightEaseDuration: 1000, 

233                autoHeightEaseFunction: "easeInOutExpo", 

234                autoSlide: false, 

235                autoSlideInterval: (${Aika.data} * 1000), 

236                autoSlideStopWhenClicked: true, 

237                crossLinking: true, 

238                dynamicArrows: true, 

239                dynamicArrowLeftText: "<", 

240                dynamicArrowRightText: ">", 

241                dynamicTabs: true, 

242                dynamicTabsAlign: "center", 

243                dynamicTabsPosition: "top", 

244                externalTriggerSelector: "a.xtrig", 

245                firstPanelToLoad: 1, 

246                panelTitleSelector: "h2.title", 

247                slideEaseDuration: 1000, 

248                slideEaseFunction: "easeInOutExpo", 

249                panelWidth: 630 

250        }, settings); 

251 

252        return this.each(function(){ 

253 

254                // Uncomment the line below to test your preloader 

255                // alert("Testing preloader"); 

256 

257                var slider = jQuery(this); 

258 

259                // If we need arrows 

260                if (settings.dynamicArrows) { 

261                        //slider.parent().addClass("arrows"); 

262                        //slider.before('<div class="arrowbg"></div><div class="coda-nav-left" id="coda-nav-left-' + sliderCount + '"><a href="#">' + settings.dynamicArrowLeftText + '</a></div>'); 

263                        //slider.after('<div class="arrowbgRight"></div><div class="coda-nav-right" id="coda-nav-right-' + sliderCount + '"><a href="#">' + settings.dynamicArrowRightText + '</a></div>'); 

264                        slider.before('<div class="arrowbg"><div class="coda-nav-left" id="coda-nav-left-' + sliderCount + '"><a href="#">' + settings.dynamicArrowLeftText + '</a></div></div>'); 

265                        slider.after('<div class="arrowbgRight"><div class="coda-nav-right" id="coda-nav-right-' + sliderCount + '"><a href="#">' + settings.dynamicArrowRightText + '</a></div></div>'); 

266                }; 

267 

268                // var panelWidth = slider.find(".panel").width(); 

269                var panelWidth = settings.panelWidth; 

270                jQuery(".panel", slider).css({ width: panelWidth }); 

271 

272                var panelCount = slider.find(".panel").size(); 

273                var panelContainerWidth = panelWidth*panelCount; 

274                var navClicks = 0; // Used if autoSlideStopWhenClicked = true 

275 

276                // Surround the collection of panel divs with a container div (wide enough for all panels to be lined up end-to-end) 

277                jQuery('.panel', slider).wrapAll('<div class="panel-container"></div>'); 

278                // Specify the width of the container div (wide enough for all panels to be lined up end-to-end) 

279                jQuery(".panel-container", slider).css({ width: panelContainerWidth }); 

280 

281                // Specify the current panel. 

282                // If the loaded URL has a hash (cross-linking), we're going to use that hash to give the slider a specific starting position... 

283                if (settings.crossLinking && location.hash && parseInt(location.hash.slice(1)) <= panelCount) { 

284                        var currentPanel = parseInt(location.hash.slice(1)); 

285                        var offset = - (panelWidth*(currentPanel - 1)); 

286                        jQuery('.panel-container', slider).css({ marginLeft: offset }); 

287                // If that's not the case, check to see if we're supposed to load a panel other than Panel 1 initially... 

288                } else if (settings.firstPanelToLoad != 1 && settings.firstPanelToLoad <= panelCount) { 

289                        var currentPanel = settings.firstPanelToLoad; 

290                        var offset = - (panelWidth*(currentPanel - 1)); 

291                        jQuery('.panel-container', slider).css({ marginLeft: offset }); 

292                // Otherwise, we'll just set the current panel to 1... 

293                } else { 

294                        var currentPanel = 1; 

295                }; 

296 

297                // Left arrow click 

298                jQuery("#coda-nav-left-" + sliderCount + " a").click(function(){ 

299                        navClicks++; 

300                        if (currentPanel == 1) { 

301                                offset = - (panelWidth*(panelCount - 1)); 

302                                alterPanelHeight(panelCount - 1); 

303                                currentPanel = panelCount; 

304                                slider.siblings('.coda-nav').find('a.current').removeClass('current').parents('ul').find('li:last a').addClass('current'); 

305                        } else { 

306                                currentPanel -= 1; 

307                                alterPanelHeight(currentPanel - 1); 

308                                offset = - (panelWidth*(currentPanel - 1)); 

309                                slider.siblings('.coda-nav').find('a.current').removeClass('current').parent().prev().find('a').addClass('current'); 

310                        }; 

311                        jQuery('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction); 

312                        if (settings.crossLinking) { location.hash = currentPanel }; // Change the URL hash (cross-linking) 

313                        return false; 

314                }); 

315 

316                // Right arrow click 

317                jQuery('#coda-nav-right-' + sliderCount + ' a').click(function(){ 

318                        navClicks++; 

319                        if (currentPanel == panelCount) { 

320                                offset = 0; 

321                                currentPanel = 1; 

322                                alterPanelHeight(0); 

323                                slider.siblings('.coda-nav').find('a.current').removeClass('current').parents('ul').find('a:eq(0)').addClass('current'); 

324                        } else { 

325                                offset = - (panelWidth*currentPanel); 

326                                alterPanelHeight(currentPanel); 

327                                currentPanel += 1; 

328                                slider.siblings('.coda-nav').find('a.current').removeClass('current').parent().next().find('a').addClass('current'); 

329                        }; 

330                        jQuery('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction); 

331                        if (settings.crossLinking) { location.hash = currentPanel }; // Change the URL hash (cross-linking) 

332                        return false; 

333                }); 

334 

335 

336 

337                // If we need a tabbed nav 

338                jQuery('#coda-nav-' + sliderCount + ' a').each(function(z) { 

339                        // What happens when a nav link is clicked 

340                        jQuery(this).bind("click", function() { 

341                                navClicks++; 

342                                jQuery(this).addClass('current').parents('ul').find('a').not(jQuery(this)).removeClass('current'); 

343                                offset = - (panelWidth*z); 

344                                alterPanelHeight(z); 

345                                currentPanel = z + 1; 

346                                jQuery('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction); 

347                                if (!settings.crossLinking) { return false }; // Don't change the URL hash unless cross-linking is specified 

348                        }); 

349                }); 

350 

351                // External triggers (anywhere on the page) 

352                jQuery(settings.externalTriggerSelector).each(function() { 

353                        // Make sure this only affects the targeted slider 

354                        if (sliderCount == parseInt(jQuery(this).attr("rel").slice(12))) { 

355                                jQuery(this).bind("click", function() { 

356                                        navClicks++; 

357                                        targetPanel = parseInt(jQuery(this).attr("href").slice(1)); 

358                                        offset = - (panelWidth*(targetPanel - 1)); 

359                                        alterPanelHeight(targetPanel - 1); 

360                                        currentPanel = targetPanel; 

361                                        // Switch the current tab: 

362                                        slider.siblings('.coda-nav').find('a').removeClass('current').parents('ul').find('li:eq(' + (targetPanel - 1) + ') a').addClass('current'); 

363                                        // Slide 

364                                        jQuery('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction); 

365                                        if (!settings.crossLinking) { return false }; // Don't change the URL hash unless cross-linking is specified 

366                                }); 

367                        }; 

368                }); 

369 

370                // Specify which tab is initially set to "current". Depends on if the loaded URL had a hash or not (cross-linking). 

371                if (settings.crossLinking && location.hash && parseInt(location.hash.slice(1)) <= panelCount) { 

372                        jQuery("#coda-nav-" + sliderCount + " a:eq(" + (location.hash.slice(1) - 1) + ")").addClass("current"); 

373                // If there's no cross-linking, check to see if we're supposed to load a panel other than Panel 1 initially... 

374                } else if (settings.firstPanelToLoad != 1 && settings.firstPanelToLoad <= panelCount) { 

375                        jQuery("#coda-nav-" + sliderCount + " a:eq(" + (settings.firstPanelToLoad - 1) + ")").addClass("current"); 

376                // Otherwise we must be loading Panel 1, so make the first tab the current one. 

377                } else { 

378                        jQuery("#coda-nav-" + sliderCount + " a:eq(0)").addClass("current"); 

379                }; 

380 

381                // Set the height of the first panel 

382                if (settings.autoHeight) { 

383                        panelHeight = jQuery('.panel:eq(' + (currentPanel - 1) + ')', slider).height(); 

384                        slider.css({ height: panelHeight }); 

385                }; 

386 

387                // Trigger autoSlide 

388                if (settings.autoSlide) { 

389                        slider.ready(function() { 

390                                setTimeout(autoSlide,settings.autoSlideInterval); 

391                        }); 

392                }; 

393 

394                function alterPanelHeight(x) { 

395                        if (settings.autoHeight) { 

396                                panelHeight = jQuery('.panel:eq(' + x + ')', slider).height() 

397                                slider.animate({ height: panelHeight }, settings.autoHeightEaseDuration, settings.autoHeightEaseFunction); 

398                        }; 

399                }; 

400 

401                function autoSlide() { 

402                        if (navClicks == 0 || !settings.autoSlideStopWhenClicked) { 

403                                if (currentPanel == panelCount) { 

404                                        var offset = 0; 

405                                        currentPanel = 1; 

406                                } else { 

407                                        var offset = - (panelWidth*currentPanel); 

408                                        currentPanel += 1; 

409                                }; 

410                                alterPanelHeight(currentPanel - 1); 

411                                // Switch the current tab: 

412                                slider.siblings('.coda-nav').find('a').removeClass('current').parents('ul').find('li:eq(' + (currentPanel - 1) + ') a').addClass('current'); 

413                                // Slide: 

414                                jQuery('.panel-container', slider).animate({ marginLeft: offset }, settings.slideEaseDuration, settings.slideEaseFunction); 

415                                setTimeout(autoSlide,settings.autoSlideInterval); 

416                        }; 

417                }; 

418 

419                // Kill the preloader 

420                jQuery('.panel', slider).show().end().find("p.loading").remove(); 

421                slider.removeClass("preload"); 

422 

423                sliderCount++; 

424 

425        }); 

426}; 

427</script> 

428 

429 

430<!-- CODA-SLIDER STYLE --> 

431<style type="text/css"> 

432 

433 .panel-element { 

434                 margin: 0px 1px 0px 1px; 

435                 background:#000; 

436                 color:#ffffff; 

437                width:206px; 

438                height: 50px; 

439                position: absolute; 

440                top: 0; 

441                opacity: .5; 

442                -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 

443                filter: alpha(opacity=50); 

444        } 

445 

446.paneltd-image { 

447        float:left;} 

448 

449 

450.coda-nav ul{ 

451        clear:both; 

452        display:block; 

453        margin:auto; 

454        overflow:hidden; 

455        margin-top:0; 

456        margin-bottom:25px; 

457        min-height:22px;} 

458 

459.ie7 .coda-nav ul { 

460        margin-top:0;} 

461 

462.coda-nav ul li { 

463        display:inline;} 

464 

465.coda-nav ul li a { 

466        background:none; 

467        color:#fff; 

468        display:block; 

469        float:left; 

470        margin-right:5px; 

471        padding:5px 10px; 

472        text-decoration:bold; 

473        font-size:20px 

474        outline: none; ;} 

475 

476.coda-slider .panel-container { 

477        position:relative; } 

478 

479.panel-wrapper-text-image { 

480        position: relative; } 

481 

482 

483  ## 

484  ## FIXED CSS BELOW 

485  ## 

486  .carousel 

487  { 

488    overflow: hidden; 

489    width: 700px; 

490    position: relative; 

491  } 

492 

493  .carousel a, 

494  .carousel a:hover 

495  { 

496    cursor: pointer; 

497    text-decoration: none; 

498  } 

499 

500  .carousel tr 

501  { 

502    vertical-align: top; 

503  } 

504 

505  .carousel .panel-element, 

506  .carousel .arrowbg, 

507  .carousel .arrowbgRight 

508  { 

509    opacity: 0.6; 

510    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; 

511    filter: alpha(opacity=60); } 

512  } 

513 

514  .carousel a img 

515  { 

516    display: block; 

517    vertical-align: top; 

518  } 

519 

520  .paneltd 

521  { 

522    border-right: 2px solid #fff; 

523    float: left; 

524    height:50px; 

525    width:207px; 

526  } 

527 

528  .carousel .paneltd-p 

529  { 

530    color:#fff; 

531    line-height: normal; 

532    margin: 0; 

533    padding: 3px 3px 0 100px; 

534  } 

535 

536  .carousel .coda-slider-wrapper 

537  { 

538    clear:both; 

539    margin-top:-50px; 

540    overflow: hidden; 

541    padding:0; 

542  } 

543 

544  .carousel .coda-slider 

545  { 

546    background: none; 

547    overflow: hidden; 

548    padding: 0; 

549  } 

550 

551  .carousel .coda-slider-wrapper .coda-slider 

552  { 

553    float: left; 

554    margin-left: 37px; 

555    width: 630px; 

556  } 

557 

558  .carousel .banners 

559  { 

560    width: 700px; 

561  } 

562 

563  .carousel .panel-wrapper { 

564    width: 630px; 

565    min-height: 50px; 

566    height: auto !important; 

567    height: 50px; 

568  } 

569 

570  .carousel .coda-slider .panel 

571  { 

572    display: block; 

573    float: left; 

574    overflow: hidden; 

575  } 

576 

577  .carousel .arrowbg, 

578  .carousel .arrowbgRight 

579  { 

580    background: #000; 

581    height: 50px; 

582    position: absolute; 

583    width: 35px; 

584    z-index: 1; 

585  } 

586 

587  .carousel .arrowbg 

588  { 

589    left: 0; 

590  } 

591 

592  .carousel .arrowbgRight 

593  { 

594    left:  664px; 

595  } 

596 

597  .carousel .coda-nav-left,.coda-nav-right 

598  { 

599    color:#fff; 

600    font-family: Verdana, "Times New Roman", Times, serif; 

601    float: left; 

602    font-size: 20px; 

603    font-weight: bold; 

604    height: 50px; 

605    width:35px; 

606  } 

607 

608  .carousel .coda-nav-left { 

609    border-right: 2px solid #fff; 

610  } 

611  .carousel .coda-nav-right { 

612  } 

613 

614  .coda-nav-left a, 

615  .coda-nav-right a { 

616    color: #fff; 

617    display: block; 

618    height: 50px; 

619    line-height: 50px; 

620    text-align: center; 

621    outline: none; 

622  } 

623 

624  .coda-nav-left a:hover, 

625  .coda-nav-right a:hover 

626  { 

627    color: #b3b3b3; 

628  } 

629 

630</style> 

631 

632<!-- SIBA COLOR STYLE --> 

633<style type="text/css"> 

634    .klassinen {background-color:#00a3e0;  } 

635    .jazz{background-color:#f4364c;  } 

636    .kansanmusiikki{background-color:#e3e935;  } 

637    .monigenre{background-color:#9b26b6;  } 

638    .ooppera{background-color:#ff8200;  } 

639    .pop_ja_rock{background-color:#84bd00;  } 

640    .yleisvari{background-color:#0055a5;  } 

641    .nykymusiikki{background-color:#00ab84;  } 

642 

643 

644  div.background 

645  { 

646    width:700px; 

647    height:380px; 

648  } 

649 

650  div.transbox 

651  { 

652    width:246px; 

653    position: absolute; 

654    height:330px; 

655    margin:0px 460px 0px 0px; 

656    /* for IE */ 

657    filter:alpha(opacity=40); 

658    /* CSS3 standard */ 

659    opacity:0.4; 

660  } 

661 

662  div.transbox p 

663  { 

664    margin:10px 20px; 

665    font-weight:bold; 

666    color:#ffffff; 

667  } 

668 

669  .transbox-text 

670  { 

671    position: relative; 

672    width: 185px; 

673    padding: 20px 30px; 

674    color: #fff; 

675    text-shadow: 1px 1px 1px #000; 

676    line-height: normal; 

677  } 

678 

679  .transbox-text h2 

680  { 

681    color: #fff; 

682    font-size: 25px; 

683    font-weight: normal; 

684    margin: 0 0 10px 0; 

685  } 

686 

687  .transbox-text p.kuvaus 

688  { 

689    font-size: 15px; 

690    font-weight: bold; 

691    margin: 0 0 10px 0; 

692  } 

693</style> 

694 

695<div id="carousel" class="carousel" style="display: none;"> 

696  <div class="coda-slider preload banners" id="coda-slider-2"> 

697	#set ($nowString = $dateTool.format("yyyyMMdd", $dateTool.getDate())) 

698	#set($integer = 0) 

699	##set ( $banners = ${Banneri.siblings} ) 

700	#set ($banners = [])  

701	#foreach($ban in ${Banneri.siblings}) 

702		#set ($nakyvyysAlkaa = $ban.NakyvyysAlkaa.data)  

703		#set ($nakyvyysLoppuu = $ban.NakyvyysLoppuu.data) 

704		#if ($integer.parseInt($nowString) >= $integer.parseInt($nakyvyysAlkaa) && $integer.parseInt($nowString) <= $integer.parseInt($nakyvyysLoppuu))	 

705			#set($temp = $banners.add($ban)) 

706		#end 

707	#end 

708    #set ( $bannersSize = ${banners.size()} ) 

709    #set ( $slideCounter = 1 ) 

710    #foreach($ban in $banners) 

711 

712      <div class="panel"> 

713        <div class="background" style="background:url(${ban.Kuvatiedosto.data}) no-repeat;" onclick="document.location='${ban.Linkki.data}';"> 

714          <div class="transbox ${ban.Varimalli.data}"></div> 

715 

716            #if (${velocityCount} > 1) #set( $slideCounter = ${velocityCount} ) #end 

717            #if (${velocityCount} == 1) #set( $slideCounter = 1 ) #end 

718            #if (${velocityCount} == ${bannersSize} || ${velocityCount} == ${bannersSize} - 1) #set( $slideCounter =  ${bannersSize} - 2) #end 

719            #if (${slideCounter} < 1) #set( $slideCounter = 1) #end 

720 

721            <!-- <a class="xtrig" href="#${slideCounter}" rel="coda-slider-1"> --> 

722            <a href="${ban.Linkki.data}"> 

723              <div class="transbox-text"> 

724                <h2>${ban.Otsikko.data}</h2> 

725                <p class="kuvaus">${ban.Kuvaus.data}</p> 

726                <p class="ajankohta">${ban.Ajankohta.data}</p> 

727              </div> 

728            </a> 

729        </div> <!-- background --> 

730      </div> <!-- panel --> 

731 

732    #end 

733  </div><!-- coda-slider-2 --> 

734 

735 

736  <div class="coda-slider-wrapper"> 

737 

738        <div class="coda-slider preload" id="coda-slider-1"> 

739 

740          #set ( $secondMax = $bannersSize - 1 ) 

741          #set( $index = 0 ) 

742          #set( $nextIndex = 1 ) 

743          #set( $nextNextIndex = 2 ) 

744 

745          #set ($ban1Text = "") 

746          #set ($ban2Text = "") 

747          #set ($ban3Text = "") 

748 

749          #foreach($ban in $banners) 

750 

751            #if( $nextNextIndex > $secondMax ) 

752                #break 

753            #end 

754 

755            #set( $ban2 = ${banners.get($nextIndex)} ) 

756            #set( $ban3 = ${banners.get($nextNextIndex)} ) 

757 

758            #set( $index = $index + 1 ) 

759            #set( $nextIndex = $nextIndex  + 1 ) 

760            #set( $nextNextIndex = $nextNextIndex + 1 ) 

761 

762            #if( ($foreach.count % 3 == 0) || ($foreach.count % 2 == 0) ) 

763                ## print nothing 

764            #else 

765 

766            ## 

767            ## Cut panel texts when necessary 

768            ## 

769            #if ($ban.NauhaTeksti.data.length() > 50) 

770              #set ($ban1Text = "${ban.NauhaTeksti.data.substring(0,50)}...") 

771            #else 

772              #set ($ban1Text = $ban.NauhaTeksti.data) 

773            #end 

774            #if ($ban2.NauhaTeksti.data.length() > 50) 

775              #set ($ban2Text = "${ban2.NauhaTeksti.data.substring(0,50)}...") 

776            #else 

777              #set ($ban2Text = $ban2.NauhaTeksti.data) 

778            #end 

779            #if ($ban3.NauhaTeksti.data.length() > 50) 

780              #set ($ban3Text = "${ban3.NauhaTeksti.data.substring(0,50)}...") 

781            #else 

782              #set ($ban3Text = $ban3.NauhaTeksti.data) 

783            #end 

784 

785            <div class="panel"> 

786                <div class="panel-wrapper"> 

787                  <table> 

788                    <tr> 

789                      <td class="paneltd"> 

790                        <div class="panel-element"></div> 

791                        <div class="panel-wrapper-text-image"> 

792                          <div class="paneltd-image"><a class="xtrig" href="#${index}" rel="coda-slider-2"><img src="${ban.PikkuKuvatiedosto.data}" width="90" height="50" /></a></div> 

793                          <p class="paneltd-p">${ban1Text}</p> 

794                        </div> 

795                      </td> 

796                      <td class="paneltd"> 

797                    <div class="panel-element"></div> 

798                   <div class="panel-wrapper-text-image"> 

799                    <div class="paneltd-image"><a class="xtrig" href="#${nextIndex}" rel="coda-slider-2"><img src="${ban2.PikkuKuvatiedosto.data}" width="90" height="50" /></a></div> 

800                    <p class="paneltd-p">${ban2Text}</p> 

801                   </div></td> 

802                    <td class="paneltd"> 

803                    <div class="panel-element"></div> 

804                   <div class="panel-wrapper-text-image"> 

805                   <div class="paneltd-image"><a class="xtrig" href="#${nextNextIndex}" rel="coda-slider-2"><img src="${ban3.PikkuKuvatiedosto.data}" width="90" height="50" /></a></div> 

806                    <p class="paneltd-p">${ban3Text}</p> 

807                     </div></td> 

808                </tr> 

809              </table> 

810            </div> 

811          </div> 

812        #end 

813      #end 

814    </div> <!-- coda-slider-1 --> 

815  </div> <!-- coda-slider-wrapper --> 

816</div> <!-- carousel --> 

817 

818 

819<script type="text/javascript"> 

820 

821  ## 

822  ## IE renders this twice (all javascripts). Apparently a Liferay-bug !!! 

823  ## 

824  if (reqCount < 1) { 

825    reqCount++; 

826 

827    jQuery(document).ready(function() { 

828		## 

829		## IE renders ugly if shown before 

830		## 

831		jQuery("#carousel").show(); 

832 

833		jQuery('#coda-slider-1').codaSlider({ 

834            autoSlide: false, 

835            dynamicArrows: true, 

836            panelHeight: 50, 

837            panelWidth: 630 

838        }); 

839 

840        jQuery('#coda-slider-2').codaSlider({ 

841            autoSlide: true, 

842            autoSlideInterval: (${Aika.data} * 1000), 

843            autoSlideStopWhenClicked: true, 

844            dynamicArrows: false, 

845            panelHeight: 50, 

846            panelWidth: 700 

847        }); 

848    }); 

849  } 

850</script>