bachir
/
popsu-d7


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
							<!DOCTYPE html>
<html>
<head>
	<meta content="charset=utf-8">
	<title>FlexSlider Demo</title>
	
	<!-- FlexSlider pieces -->
	<link rel="stylesheet" href="flexslider.css" type="text/css" media="screen" />
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
	<script src="jquery.flexslider-min.js"></script>
	
	<!-- Includes for this demo -->
	<link rel="stylesheet" href="demo-stuff/demo.css" type="text/css" media="screen" />
	
	<!-- Hook up the FlexSlider -->
	<script type="text/javascript">
		$(window).load(function() {
			$('.flexslider').flexslider();
		});
	</script>
</head>
<body>
	<div id="container">
		<h2>FlexSlider Demo - <a href="http://flex.madebymufffin.com">Visit the homepage for documentation details</a></h2>
		
		<!--=============================
		Markup for FADE animation
		=================================-->
		<div class="flexslider">
	    <ul class="slides">
	    	<li>
	    		<img src="demo-stuff/inacup_samoa.jpg" />
	    		<p class="flex-caption">Captions and cupcakes. Winning combination.</p>
	    	</li>
	    	<li>
	    		<a href="http://flex.madebymufffin.com"><img src="demo-stuff/inacup_pumpkin.jpg" /></a>
	    		<p class="flex-caption">This image is wrapped in a link!</p>
	    	</li>
	    	<li>
	    		<img src="demo-stuff/inacup_donut.jpg" />
	    	</li>
	    	<li>
	    		<img src="demo-stuff/inacup_vanilla.jpg" />
	    	</li>
	    </ul>
	  </div>
	  
		<!--============================
		Markup for SLIDE animation
		You need to add an extra container element for the overflow: hidden property on the slider
		
		Update your flexslider() function with the following properties:
		
		<script type="text/javascript">
			$(window).load(function() {
				$('.flexslider').flexslider({
				  animation: "slide",
				  controlsContainer: ".flexslider-container"
			  });
			});
		</script>
		=================================
		<div class="flexslider-container">
			<div class="flexslider">
		    <ul class="slides">
		    	<li>
		    		<img src="demo-stuff/inacup_samoa.jpg" />
		    		<p class="flex-caption">Captions and cupcakes. Winning combination.</p>
		    	</li>
		    	<li>
		    		<a href="#"><img src="demo-stuff/inacup_pumpkin.jpg" /></a>
		    		<p class="flex-caption">This image is wrapped in a link!</p>
		    	</li>
		    	<li>
		    		<img src="demo-stuff/inacup_donut.jpg" />
		    	</li>
		    	<li>
		    		<img src="demo-stuff/inacup_vanilla.jpg" />
		    	</li>
		    </ul>
		  </div>
	 	</div>
		==================================-->
	</div>
</body>
</html>