Типа меню - HTML и CSS

Кольша · 06.02.2012, 18:21

Всем привет!Пишу сайт и потребовалось сделать типа меню примерно такое:
1)есть две стрелки (картинки ну эт сам нарисую));
2)между этими стрелками ссылки;
3)нужно чтобы при нажатии на стрелки прокручивались эти ссылки автоматом например если ссылки кончились то убрать одну стрелку(на которую жали) или если ссылок мало то не показывать кнопки помогите пожалуйста!

masashama · 07.02.2012, 21:14

Думаю без JavaScript тут не обойтись. Ну или можешь сделать такую флешку.

Кольша · 08.02.2012, 11:25

ну это понято!! я уже сделал такое простенькое не такое какое хотелось но все же меню

JTG · 08.02.2012, 12:27

http://flowplayer.org/tools/demos/scrollable/index.html

Кольша · 08.02.2012, 12:51

Спасибо JTG но так как я в html нуб помогите переделать его под вертикальный лад!

JTG · 08.02.2012, 16:40

Код:

<!DOCTYPE html>
<html>
<head>
	<script src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>	
	<style type="text/css">
		/* root element for scrollable */
		.vertical {  			
			/* required settings */
			position:relative;
			overflow:hidden;	
		
			/* vertical scrollers have typically larger height than width */	
			height: 200px;	 
			width: 100px;
			border:1px solid #000;	
		}
		
		/* root element for scrollable items */
		.items {	
			position:absolute;			
			/* this time we have very large space for height */	
			height:20000em;	
			margin: 0px;
		}
		
		/* single scrollable item */
		.item {
			border:1px solid #ddd;
			margin:10px 0;
			font-size:12px;
		}
		
		/* the action buttons above the scrollable */
		.actions {
			width:100px;
			margin: 0;
			text-align: center;
		}
		
		.actions a:hover {
			text-decoration:underline;
			color:#000;
		}
		
		.disabled {
			visibility:hidden;		
		}	
	</style>
</head>

<body>
	
<!-- HTML structures -->
<div class="actions">
	<a class="prev">UP</a>
</div>

<!-- root element for scrollable -->
<div class="scrollable vertical">	 
	<!-- root element for the items -->
	<div class="items">	
			<div class="item"><a href="#">Link 0</a></div>
			<div class="item"><a href="#">Link 1</a></div>
			<div class="item"><a href="#">Link 2</a></div>
			<div class="item"><a href="#">Link 3</a></div>
			<div class="item"><a href="#">Link 4</a></div>
			<div class="item"><a href="#">Link 5</a></div>
			<div class="item"><a href="#">Link 6</a></div>
			<div class="item"><a href="#">Link 7</a></div>
			<div class="item"><a href="#">Link 8</a></div>
			<div class="item"><a href="#">Link 9</a></div>			
	</div>	
</div>

<div class="actions">
	<a class="next">DOWN</a>
</div>

<script>
	// execute your scripts when DOM is ready. this is a good habit
	$(function() {		
		$(".scrollable").scrollable({ vertical: true, mousewheel: false });		
	});
</script>

</body>
</html>

Кольша · 08.02.2012, 17:44

Огромное спасибо

06.02.2012, 18:21	#1
Кольша Далеко не Участник клуба Регистрация: 11.08.2011 Сообщений: 1,512	Типа меню Всем привет!Пишу сайт и потребовалось сделать типа меню примерно такое: 1)есть две стрелки (картинки ну эт сам нарисую)); 2)между этими стрелками ссылки; 3)нужно чтобы при нажатии на стрелки прокручивались эти ссылки автоматом например если ссылки кончились то убрать одну стрелку(на которую жали) или если ссылок мало то не показывать кнопки помогите пожалуйста! Kolsha.ru admin[@]ksware.ru

07.02.2012, 21:14	#2
masashama Учусь слушать Пользователь Регистрация: 30.01.2011 Сообщений: 66	Думаю без JavaScript тут не обойтись. Ну или можешь сделать такую флешку. Люблю программировать =)

08.02.2012, 11:25	#3
Кольша Далеко не Участник клуба Регистрация: 11.08.2011 Сообщений: 1,512	ну это понято!! я уже сделал такое простенькое не такое какое хотелось но все же меню Kolsha.ru admin[@]ksware.ru

08.02.2012, 12:27	#4
JTG я получил эту роль Старожил Регистрация: 25.05.2007 Сообщений: 3,694	http://flowplayer.org/tools/demos/scrollable/index.html пыщь

08.02.2012, 12:51	#5
Кольша Далеко не Участник клуба Регистрация: 11.08.2011 Сообщений: 1,512	Спасибо JTG но так как я в html нуб помогите переделать его под вертикальный лад! Kolsha.ru admin[@]ksware.ru

08.02.2012, 17:44	#7
Кольша Далеко не Участник клуба Регистрация: 11.08.2011 Сообщений: 1,512	Огромное спасибо Kolsha.ru admin[@]ksware.ru

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Возможно ли в массив типа char записать первым элементом значение переменной типа float?	Green Gin	Общие вопросы C/C++	2	05.12.2011 01:50
Плагин для Windows или действия с контекстным меню при выборе опр. типа файла	Человек_Борща	Общие вопросы Delphi	7	02.10.2011 21:09
Каким образом сохранить цвет. Типа в переменную типа TColor ?	serres	C++ Builder	5	07.12.2010 16:19
Запись числа типа инт в ячейку двумерного массива типа char	AxenicX	Помощь студентам	1	25.09.2009 00:35