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

افکت کتاب

با استفاده از این پلاگین می توانید در سایت خود افکت کتابی داشته باشید که هم با ماوس و هم با دکمه های چپ و راست صفحه کلید کار می کند .

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

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

    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="turn.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css" />

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

    <div id="main">
        <div id="magazine">
            <div style="background-image:url(pages/01.jpg);"></div>
            <div style="background-image:url(pages/02.jpg);"></div>
            <div style="background-image:url(pages/03.jpg);"></div>
            <div style="background-image:url(pages/04.jpg);"></div>
            <div style="background-image:url(pages/05.jpg);"></div>
            <div style="background-image:url(pages/06.jpg);"></div>
            <div style="background-image:url(pages/07.jpg);"></div>
            <div style="background-image:url(pages/08.jpg);"></div>
        </div>
    </div>
    <script type="text/javascript">
    	$(window).ready(function() {
    		$('#magazine').turn({
    				display: 'double',
    				acceleration: true,
    				gradients: !$.isTouch,
    				elevation:50,
    				when: {turned: function(e, page) {}}
    			});
    	});
    	$(window).bind('keydown', function(e){
    		if (e.keyCode==37)
    			$('#magazine').turn('previous');
    		else if (e.keyCode==39)
    			$('#magazine').turn('next');
    	});
    </script>

 

6 نظر

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

دانلود و پیش نمایش فایل افکت کتاب

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

سوالی دارید؟

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