Обновленная "БраГа" для iCMS 1.10

					<div class="slide">
						<a href="http://www.flickr.com/photos/jliba/4665625073/" title="145.365 - Happy Bokeh Thursday! | Flickr - Photo Sharing!" target="_blank"><img src="img/slide-1.jpg" width="570" height="270" alt="Slide 1"></a>
						<div class="caption" style="bottom:0">
							<p>Happy Bokeh Thursday!</p>
						</div>
					</div>

 
{foreach key=key item=brag from=$braga}
. . .
{/foreach}
 

<link rel="stylesheet" href="/templates/_default_/css/global.css">
{literal}
<script src="/templates/_default_/js/slides.min.jquery.js"></script>
	<script>
		$(function(){
			$('#slides').slides({
				preload: true,
				preloadImage: '/templates/_default_/imges/slide/loading.gif',
				play: 5000,
				pause: 2500,
				hoverPause: true,
				animationStart: function(current){
					$('.caption').animate({
						bottom:-35
					},100);
					if (window.console && console.log) {
						// example return of current slide number
						console.log('animationStart on slide: ', current);
					};
				},
				animationComplete: function(current){
					$('.caption').animate({
						bottom:0
					},200);
					if (window.console && console.log) {
						// example return of current slide number
						console.log('animationComplete on slide: ', current);
					};
				},
				slidesLoaded: function() {
					$('.caption').animate({
						bottom:0
					},200);
				}
			});
		});
	</script>
{/literal}
 
		<div id="example">
			<img src="/templates/_default_/imges/slide/new-ribbon.png" width="112" height="112" alt="New Ribbon" id="ribbon">
			<div id="slides">
				<div class="slides_container">
 
{foreach key=key item=brag from=$braga}
					<div class="slide">
						<a href="{$brag.link}" title="{$brag.title}" target="_blank"><img src="{$brag.img}" width="570" height="270" alt="{$brag.title}"></a>
						<div class="caption" style="bottom:0">
							{$brag.description}
						</div>
					</div>
{/foreach}
 
				</div>
				<a href="#" class="prev"><img src="/templates/_default_/imges/slide/arrow-prev.png" width="24" height="43" alt="Arrow Prev"></a>
				<a href="#" class="next"><img src="/templates/_default_/imges/slide/arrow-next.png" width="24" height="43" alt="Arrow Next"></a>
			</div>
			<img src="/templates/_default_/imges/slide/example-frame.png" width="739" height="341" alt="Example Frame" id="frame">
		</div>