طراحی وب سایت | طراحی سایت | شرکت طراحی وب سایت پروگ پارس

اسلایدشو درگ دراپ ( کشیدن و رها کردن )

با استفاده از این پلاگین می توانید اسلاید شویی با قابلیت کشیدن و رها کردن موس (درگ دراپ) داشته باشید.

آموزش استفاده

۱- فراخوانی کتابخانه پلاگین و خصوصیت ها

	<link rel="stylesheet" type="text/css" href="css/normalize.css" />
	<link rel="stylesheet" type="text/css" href="css/demo.css" />
	<link rel="stylesheet" type="text/css" href="css/component.css" />
	<script src="js/modernizr.custom.js"></script>
        <script src="js/draggabilly.pkgd.min.js"></script>
        <script src="js/elastiStack.js"></script>

2-  کد html جهت استفاده پلاگین

	<div class="container">
		<header>
			<h1><a href="http://ijquery.ir">دنیای جی کوئری</a> <span><a href="mailto:r.ti75@yahoo.com">رضا طاهری</a></span></h1>
		</header>
		<ul id="elasticstack" class="elasticstack">
			<li><img src="img/1.jpg" alt="01"/><h5>Picture 1</h5></li>
			<li><img src="img/2.jpg" alt="02"/><h5>Picture 2</h5></li>
			<li><img src="img/3.jpg" alt="03"/><h5>Picture 3</h5></li>
			<li><img src="img/4.jpg" alt="04"/><h5>Picture 4</h5></li>
			<li><img src="img/5.jpg" alt="05"/><h5>Picture 5</h5></li>
			<li><img src="img/6.jpg" alt="06"/><h5>Picture 6</h5></li>
		</ul>
	</div>
	<script>
		new ElastiStack( document.getElementById( 'elasticstack' ) );
	</script>

نظر دهید

دانلود و پیش نمایش

دانلود و پیش نمایش فایل اسلایدشو درگ دراپ ( کشیدن و رها کردن )

دانلود پلاگین پیش نمایش آنلاین

سوالی دارید؟

● در تلگرام، پاسخگوی شما :)