Speed up development with full-stack environments for every branch.

Learn More

Jquery Accordion Slider [PHP]

Forked from Hello World.

1996 Runs 4171 Views 1314 Copies

Jquery Accordion Slider

Saved

Saved

sanjoydesk 1

sanjoydesk
published 3 years ago

<!doctype html>
<html lang="us">
<head>
	<meta charset="utf-8">
	<title>jQuery UI Example Page</title>
	  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	<style>
	body{
		font: 62.5% "Trebuchet MS", sans-serif;
		margin: 50px;
	}
	.demoHeaders {
		margin-top: 2em;
	}
	#dialog-link {
		padding: .4em 1em .4em 20px;
		text-decoration: none;
		position: relative;
	}
	#dialog-link span.ui-icon {
		margin: 0 5px 0 0;
		position: absolute;
		left: .2em;
		top: 50%;
		margin-top: -8px;
	}
	#icons {
		margin: 0;
		padding: 0;
	}
	#icons li {
		margin: 2px;
		position: relative;
		padding: 4px 0;
		cursor: pointer;
		float: left;
		list-style: none;
	}
	#icons span.ui-icon {
		float: left;
		margin: 0 4px;
	}
	.fakewindowcontain .ui-widget-overlay {
		position: absolute;
	}
	select {
		width: 200px;
	}
	</style>
</head>
<body>

<h1>Welcome to jQuery UI!</h1>

<div class="ui-widget">
	<p>This page demonstrates the widgets and theme you selected in Download Builder. Please make sure you are using them with a compatible jQuery version.</p>
</div>

<h1>YOUR COMPONENTS:</h1>


<!-- Accordion -->
<?php 
$array  = array('First', 'Second' , 'Third'); 
$array1  = array(122 => 'Day 1', 154 =>  'Day 2' , 734 => 'Day 3'); 
$array2  = array('Event 1', 'Event 2' , 'Event 3'); 

?>
<div id="accordion">
<?php foreach ($array  as $key=>$val) { ?>
	<h3><?php echo $val; ?></h3>
			<div style="min-height:200px;">
						<div id="accordion<?php echo $key; ?>" class="sub-container-menu">
							<?php foreach($array1 as $key1=>$val1) { ?>
								<h3><?php echo $val1; ?></h3>
									<div style="min-height:200px;">
											<div id="accordion<?php echo $key.'_'.$key1; ?>" class="sub-menu">
													<?php foreach($array2 as $key2=>$val2) {  ?>
															<h3><?php echo $val2; ?></h3>
															<div>Event Role</div>
													<?php } ?>
											</div>
								    </div>
								<?php } ?>
					</div>
					
					
			
			</div>
			<?php } ?>
</div>



<script src="external/jquery/jquery.js"></script>
<script src="jquery-ui.js"></script>
<script>

$( "#accordion" ).accordion();

$(".sub-container-menu").each(function() {
	$( "#"+$(this).attr('id') ).accordion();
});

$(".sub-menu").each(function() {
	$( "#"+$(this).attr('id') ).accordion();
});


</script>
</body>
</html>
Please login/signup to get access to the terminal.

Your session has timed out.

Dismiss (the page may not function properly).