JQuery код

5688232O.png

През определено време се сменя като вади записи от БД.
 
explozen каза:

Това какво прави? Движи ли се?

http://remysharp.com/demo/marquee.html

http://jsfiddle.net/doktormolle/4c5tt/

http://www.dynamicdrive.com/dynamicindex2/cmarquee.htm
 
explozen каза:
http://www.mma-bulgaria.com/ сега би трябвало да ти зареди.

Като го разгледах сайта стигнах до извода, че е ползвано: http://jquery.malsup.com/cycle/
 
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <title>Test</title>

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  
  
  <script type="text/javascript" src="/js/jquery.cycle.all.min.js" async="async"></script>

  
  
  </head>
  <body>



<div class="top_news">
	<h3><span class="floatLeft">Водещи новини: </span><span class="slideshow" id="topNewsSlideshow"><a href="/novini/grapling-i-zhiu-zhittsu-novini/zapochvat-trenirovki-za-nachinaeshti-po-bzhzh" title="Започват тренировки за начинаещи по БЖЖ">Започват тренировки за начинаещи по БЖЖ</a><a href="/novini/mma-novini-zapadni-turniri/alistair-overeem-se-prismya-na-junior-dos-santos" title="Alistair Overeem се присмя на Junior Dos Santos">Alistair Overeem се присмя на Junior Dos Santos</a><a href="/novini/mma-novini-zapadni-turniri/rezultati-ot-ufc-155-dos-santos-vs-velasquez" title="Резултати от UFC 155: Dos Santos vs Velasquez">Резултати от UFC 155: Dos Santos vs Velasquez</a><a href="/novini/boks-novini/kubrat-pulev-se-izkachi-do-3-v-svetovnata-ranglista" title="Кубрат Пулев се изкачи до №3 в световната ранглиста">Кубрат Пулев се изкачи до №3 в световната ранглиста</a><a href="/novini/mma-novini-zapadni-turniri/jose-aldo-e-gotov-da-svali-kategoriyata-ako-mu-dadat-direktno-dvuboy-za-titlata" title="Jose Aldo е готов да свали категорията, ако му дадaт директно двубой за титлата">Jose Aldo е готов да свали категорията, ако му дадaт директно двубой за титлата</a><a href="/novini/mma-novini-zapadni-turniri/paul-daley-otstranen-ot-8-mia-sezon-na-bellator" title="Paul Daley отстранен от 8-мия сезон на Bellator">Paul Daley отстранен от 8-мия сезон на Bellator</a><a href="/novini/boks-novini/kubrat-pulev-shte-se-bie-s-tomash-adamek-pobeditelyat-sreshta-vladimir-klichko" title="Кубрат Пулев ще се бие с Томаш Адамек, победителят среща Владимир Кличко">Кубрат Пулев ще се бие с Томаш Адамек, победителят среща Владимир Кличко</a><a href="/novini/mma-novini-zapadni-turniri/hendo-ostavat-mi-pone-chetiri-dvuboya" title="Hendo: Остават ми поне четири двубоя">Hendo: Остават ми поне четири двубоя</a><a href="/statii/drugi-statii/zashto-magazinat-na-mma-bulgaria-e-nay-predpochitaniyat" title="Защо магазинът на ММА България е най-предпочитаният?">Защо магазинът на ММА България е най-предпочитаният?</a></span></h3>
	<div class="controls">
		<a href="#" title="Предишна" class="sprite prev">Предишна</a>
		<a href="#" title="Пауза" class="sprite pause">Пауза</a>
		<a href="#" title="Следваща" class="sprite next">Следваща</a>
	</div>
</div>



<script type="text/javascript">
//<![CDATA[
$(document).ready(function () {	$('#topNewsSlideshow').cycle({
		fx: 'scrollHorz',
		pause: 1,
		next: 'div.top_news a.next',
		prev: 'div.top_news a.prev',
		timeout: 4000,
		speed: 560,
		sync: 1
		/*cssBefore: { top: 14 },
		animIn: { top: 0 },
		animOut: { top: -14 }*/
		/*cssBefore: { left: -500 },
		animIn: { left: 0 },
		animOut: { left: 500 }*/
	});

	$('div.top_news a.pause').click(function(eO) {
		eO.stopPropagation();
		eO.preventDefault();
		var cP = $('#topNewsSlideshow').attr('cyclePause');
		$('#topNewsSlideshow').attr('cyclePause', !cP);
	});
	$('.scrolling-products-container').cycle({
		fx: 'scrollHorz',
		pause: 1,
		next: '.next0',
		prev: '.prev0',
		timeout: 3500,
		speed: 1000,
		sync: 1
	});


</script>


  </body>
</html>
 
HTML:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://www.mma-bulgaria.com/js/jquery.cycle.all.min.js" async="async"></script>
<style type="text/css">
.sprite{
	background: url(http://www.mma-bulgaria.com/img/wmma/list_images.png) no-repeat 0 0;
}
.controls{
	float: right;
	width: 30px;
	margin: 4px 0 0;
}
.controls a{
	display: block;
	float: left;
	width:10px;
}
.top_news{
	margin: 15px 0 5px;
	overflow: hidden;
}
.controls .prev{
	text-indent: -9999px;
	background-position: 0 -12px;
}
.pause{
	text-indent: -9999px;
	background-position: 0 -25px;
}
.controls .next{
	text-indent: -9999px;
	background-position: 0 -38px;
}
.top_news h3{
	font: bold 12px Arial;
	color: #ce2e20;
	float: left;
	margin: 3px 0;
}
.top_news h3 a{
	font-style: normal;
	color: #015689;
}
</style>
<script type="text/javascript">
$(document).ready(function () {
	$('#topNewsSlideshow').cycle({
		fx: 'scrollHorz',
		pause: 1,
		next: 'div.top_news a.next',
		prev: 'div.top_news a.prev',
		timeout: 4000,
		speed: 560,
		sync: 1
	});

	$('div.top_news a.pause').click(function(eO) {
		eO.stopPropagation();
		eO.preventDefault();
		var cP = $('#topNewsSlideshow').attr('cyclePause');
		$('#topNewsSlideshow').attr('cyclePause', !cP);
	});
});
</script>
<div class="top_news">
	<h3><span class="floatLeft">Водещи новини: </span>
	<span class="slideshow" id="topNewsSlideshow">
		<a href="/novini/grapling-i-zhiu-zhittsu-novini/zapochvat-trenirovki-za-nachinaeshti-po-bzhzh" title="Започват тренировки за начинаещи по БЖЖ">Започват тренировки за начинаещи по БЖЖ</a>
		<a href="/novini/mma-novini-zapadni-turniri/alistair-overeem-se-prismya-na-junior-dos-santos" title="Alistair Overeem се присмя на Junior Dos Santos">Alistair Overeem се присмя на Junior Dos Santos</a>
	</span></h3>
	<div class="controls">
		<a href="#" title="Предишна" class="sprite prev">Предишна</a>
		<a href="#" title="Пауза" class="sprite pause">Пауза</a>
		<a href="#" title="Следваща" class="sprite next">Следваща</a>
	</div>
</div>
 
Ticketa каза:
HTML:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://www.mma-bulgaria.com/js/jquery.cycle.all.min.js" async="async"></script>
<style type="text/css">
.sprite{
	background: url(http://www.mma-bulgaria.com/img/wmma/list_images.png) no-repeat 0 0;
}
.controls{
	float: right;
	width: 30px;
	margin: 4px 0 0;
}
.controls a{
	display: block;
	float: left;
	width:10px;
}
.top_news{
	margin: 15px 0 5px;
	overflow: hidden;
}
.controls .prev{
	text-indent: -9999px;
	background-position: 0 -12px;
}
.pause{
	text-indent: -9999px;
	background-position: 0 -25px;
}
.controls .next{
	text-indent: -9999px;
	background-position: 0 -38px;
}
.top_news h3{
	font: bold 12px Arial;
	color: #ce2e20;
	float: left;
	margin: 3px 0;
}
.top_news h3 a{
	font-style: normal;
	color: #015689;
}
</style>
<script type="text/javascript">
$(document).ready(function () {
	$('#topNewsSlideshow').cycle({
		fx: 'scrollHorz',
		pause: 1,
		next: 'div.top_news a.next',
		prev: 'div.top_news a.prev',
		timeout: 4000,
		speed: 560,
		sync: 1
	});

	$('div.top_news a.pause').click(function(eO) {
		eO.stopPropagation();
		eO.preventDefault();
		var cP = $('#topNewsSlideshow').attr('cyclePause');
		$('#topNewsSlideshow').attr('cyclePause', !cP);
	});
});
</script>
<div class="top_news">
	<h3><span class="floatLeft">Водещи новини: </span>
	<span class="slideshow" id="topNewsSlideshow">
		<a href="/novini/grapling-i-zhiu-zhittsu-novini/zapochvat-trenirovki-za-nachinaeshti-po-bzhzh" title="Започват тренировки за начинаещи по БЖЖ">Започват тренировки за начинаещи по БЖЖ</a>
		<a href="/novini/mma-novini-zapadni-turniri/alistair-overeem-se-prismya-na-junior-dos-santos" title="Alistair Overeem се присмя на Junior Dos Santos">Alistair Overeem се присмя на Junior Dos Santos</a>
	</span></h3>
	<div class="controls">
		<a href="#" title="Предишна" class="sprite prev">Предишна</a>
		<a href="#" title="Пауза" class="sprite pause">Пауза</a>
		<a href="#" title="Следваща" class="sprite next">Следваща</a>
	</div>
</div>
Не се сменят новините и не работят контролите.
 
При мен бачка.

HTML:
<!DOCTYPE HTML>
<html>
	<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
	<script type="text/javascript" src="http://www.mma-bulgaria.com/js/jquery.cycle.all.min.js" async="async"></script>
	<style type="text/css">
	.sprite{
		background: url(http://www.mma-bulgaria.com/img/wmma/list_images.png) no-repeat 0 0;
	}
	.controls{
		float: right;
		width: 30px;
		margin: 4px 0 0;
	}
	.controls a{
		display: block;
		float: left;
		width:10px;
	}
	.top_news{
		margin: 15px 0 5px;
		overflow: hidden;
	}
	.controls .prev{
		text-indent: -9999px;
		background-position: 0 -12px;
	}
	.pause{
		text-indent: -9999px;
		background-position: 0 -25px;
	}
	.controls .next{
		text-indent: -9999px;
		background-position: 0 -38px;
	}
	.top_news h3{
		font: bold 12px Arial;
		color: #ce2e20;
		float: left;
		margin: 3px 0;
	}
	.top_news h3 a{
		font-style: normal;
		color: #015689;
	}
	.floatLeft {
		float: left;
	}
	#topNewsSlideshow {
		width: 500px;
		height: 14px;
		overflow: hidden;
		display: block;
		float: left;
	}

	#topNewsSlideshow a {
		display: block;
		background-color: #fafafa;
		width: 500px;
	}
	</style>
	<script type="text/javascript">
	$(document).ready(function () {
		$('#topNewsSlideshow').cycle({
			fx: 'scrollHorz',
			pause: 1,
			next: 'div.top_news a.next',
			prev: 'div.top_news a.prev',
			timeout: 4000,
			speed: 560,
			sync: 1
		});

		$('div.top_news a.pause').click(function(eO) {
			eO.stopPropagation();
			eO.preventDefault();
			var cP = $('#topNewsSlideshow').attr('cyclePause');
			$('#topNewsSlideshow').attr('cyclePause', !cP);
		});
	});
	</script>
	</head>
<body>
<div style="width: 100%">
	<div class="top_news">
		<h3><span class="floatLeft">Водещи новини: </span>
		<span class="slideshow" id="topNewsSlideshow">
			<a href="/novini/grapling-i-zhiu-zhittsu-novini/zapochvat-trenirovki-za-nachinaeshti-po-bzhzh" title="Започват тренировки за начинаещи по БЖЖ">Започват тренировки за начинаещи по БЖЖ</a>
			<a href="/novini/mma-novini-zapadni-turniri/alistair-overeem-se-prismya-na-junior-dos-santos" title="Alistair Overeem се присмя на Junior Dos Santos">Alistair Overeem се присмя на Junior Dos Santos</a>
		</span></h3>
		<div class="controls">
			<a href="#" title="Предишна" class="sprite prev">Предишна</a>
			<a href="#" title="Пауза" class="sprite pause">Пауза</a>
			<a href="#" title="Следваща" class="sprite next">Следваща</a>
		</div>
	</div>
</div>
</body>
</html>
 

Back
Горе