помогите с меню

harek13 · March 22, 2011

доброе время суток. есть вот такой код:

?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>one</title>
<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function() {
  var $topLinks2 = $('#tab-nav > ul > li > a');
  $topLinks2.click(function() {
    var $parentItem = $(this).parent(),
        slideAmt = $(this).next().width(),
        direction;
    $topLinks2.removeClass('expanded');
    if (parseInt($parentItem.css('marginLeft'), 10) < 0) {
      direction = '+=';
    } else {
      $(this).addClass('expanded');
      direction = '-=';
    }
    $parentItem
      .animate({marginLeft: direction + slideAmt}, 400)
        .siblings()
        .animate({marginLeft: '0'}, 150);
    return false;
  });
});

</script>
<style type="text/css">
/* nav wrapper */
.tab-nav {
	position: relative;
	width: 610px;
	overflow: hidden;
}
.tab-nav ul {
	position: relative;
	float: left;
	width: 1600px;
	margin-left: 535px;
	padding-left: 0;
	list-style-type: none;
	background-color: #fff;
	;
}
.tab-nav li {
	float: left;
	clear: left;
	;
}
.tab-nav a {
	display: block;
	width: 74px;
	border-right: 1px solid #ddd;
	height: 25px;
	line-height: 24px;
	float: left;
	text-align: center;
	text-decoration: none;
	color: #000;
}
.tab-nav a.expanded {
	background-position: 2px -244px;
	;
}
.tab-nav ul ul {
	float: left;
	background-color: #333;
	width: auto;
	margin-left: 0;
	;
}
.tab-nav li li {
	clear: none;
}
.tab-nav li li a {
	color: #fff;
	width: 100px;
	background-image: none;
}

body{
	/* Setting default text color, background and a font stack */
	color:#444444;
	font-size:13px;
	background: #f2f2f2;
	font-family:Arial, Helvetica, sans-serif;
}

body{
	/* Page reset */
	margin:0px;
	padding:0px;
}

p{
	padding:10px;
	text-align:center;
}
p{
	/* Page reset */
	margin:0px;
	padding:0px;
}

</style>
</head>

<body>

<div id="tab-nav" class="tab-nav">
	<ul>
		<li><a href="#">one</a>
		<ul>
			<li><a href="#">sub one</a></li>
			<li><a href="#">sub two</a></li>
			<li><a href="#">sub three</a></li>
		</ul>
		</li>
		<li><a href="#">two</a>
		<ul>
			<li><a href="#">b sub one</a></li>
			<li><a href="#">b sub two</a></li>
			<li><a href="#">b sub three</a></li>
			<li><a href="#">b sub four</a></li>
			<li><a href="#">b sub five</a></li>
		</ul>
		</li>
		<li><a href="#">three</a>
		<ul>
			<li><a href="#">sub one</a></li>
			<li><a href="#">sub two</a></li>
			<li><a href="#">sub three</a></li>
		</ul>
		</li>
	</ul>
</div>


</body>

</html>

подскажите кто-нибудь как перенести это меню влево - то есть чтоб открывалось слево-направо. то есть наоборот. заранее большое спасибо.

Edited March 22, 2011 by harek13

psywalker · March 22, 2011

подскажите кто-нибудь как перенести это меню влево - то есть чтоб открывалось слево-направо. то есть наоборот. заранее большое спасибо.

Зачем так путаешь народ?)

1. Дай ссылку на страницу с примером.

2. Покажи два скрина, как сейчас и как должно быть.

3. Как это должно работать? По нажатию на что-то и т.д.

harek13 · March 22, 2011

Зачем так путаешь народ?)
1. Дай ссылку на страницу с примером.
2. Покажи два скрина, как сейчас и как должно быть.
3. Как это должно работать? По нажатию на что-то и т.д.

http://ruseller.com/lessons.php?rub=32&id=458

сори и вправду как то не очень объяснил. вот. в этом примере все менюшки двигаются справо-налево. а нужно чтоб слево-направо. работать все должно аналогично примеру - только в другую сторону. самый простой вариант - это заменить все left на right и еще немного поколдовать - все работает. но это не проходит в IE

Sign In

помогите с меню

Question

harek13

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

harek13

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information