ijquery

منو افقی کشویی

screenshot

منو افقی کشویی بسیار جذاب

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

  1. فراخوانی css
    <link rel="stylesheet" href="demo.css?v=2">

     

  2. فراخوانی html
    	<div id="menu-wrapper">
    		<ul class="menu">
    			<li> <a href="#">آموزش سی اس اس</a> </li>
    			<li> <a href="#">آموزش جی کوئری</a> </li>
    			<li> <a href="#">کد</a> </li>
    			<li> <a href="#">مباحث آزاد</a> </li>
    		</ul>
    	</div>
    	<div id="submenu-wrapper">
    		<ul class="submenu">
    			<li>
    				<a href="#">
    					<img src="images/9.jpg" />
    					افکت فتوشاپ و خواص سی اس اس 3
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/10.jpg" />
    					موزیک پلیر سی اس اس 3
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/11.jpg" />
    					استفاده از خاصیت وب فونت
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/12.jpg" />
    					استایل عناصر گوگل
    				</a>
    			</li>
    		</ul>
    		<ul class="submenu">
    			<li>
    				<a href="#">
    					<img src="images/13.jpg" />
    					ایجاد فرم جستجو  
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/14.jpg" />
    					ایجاد اسلاید پی در پی
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/15.jpg" />
    					ایجاد منوی داشبورد
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/16.jpg" />
    					ایجاد ناوبری
    				</a>
    			</li>
    		</ul>
    		<ul class="submenu">
    			<li>
    				<a href="#">
    					<img src="images/5.jpg" />
    					کد محو شدن در وب
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/6.jpg" />
    					 کد منوی پرواز سی اس اس
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/7.jpg" />
    					اینپوت توییتر
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/8.jpg" />
    					کد دکمه شناور
    				</a>
    			</li>
    		</ul>
    		<ul class="submenu">
    			<li>
    				<a href="#">
    					<img src="images/1.jpg" />
    					پلاگین جی کوئری jConfirmAction
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/2.jpg" />
    					پک عناصر ui
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/3.jpg" />
    					طرح لایه باز دکمه
    				</a>
    			</li>
    			<li>
    				<a href="#">
    					<img src="images/4.jpg" />
    					تولتیپ جی کوئری
    				</a>
    			</li>
    		</ul>
    	</div>
    
    	<p id="title">
    		AUTO MOVING SUBMENU USING JQUERY 
    
    	</p>
    
    	<script>!window.jQuery && document.write(unescape('%3Cscript src="jquery-1.7.1.min.js"%3E%3C/script%3E'))</script>
    	<script type="text/javascript" src="demo.js"></script>

     

 

 


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

1 دیدگاه دربارهٔ «منو افقی کشویی»

دیدگاه‌ خود را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *