Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 09.10.2014, 12:29   #1
Zugelman
Пользователь
 
Регистрация: 08.04.2009
Сообщений: 50
Восклицание Плавная прокрутка лендинга и подсветка меню. Решил проблему см.готовый пример

Создал плавную прокрутку но в браузере Mozzila не работает и не ругается.
Код HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Скроллинг</title>
<script src="E:/Webserver/home/scrolls/www/js/jquery-1.11.1.js" type="text/javascript"></script>
<style>
#wrap{
     margin: 0 auto; 
  width: 500px; 
  height: 3000px; 
  outline: 1px solid #cc0000;
    
}
#nav{
 margin: 0 auto;   
    
}
#nav li{
    text-decoration: none;
  float: left; 
   margin-left: 20px;
    
}
</style>
<script style="text/javascript">

var pos_y = [100,200,300,400,500];
$(document).ready(function(){
   $("#nav li").click(function(){
      var count= $("#nav li").index(this);
      $("#nav li.active").removeClass("active");
		$("#nav li").eq(count).addClass("active");
         $('html,body').animate( { scrollTop: pos_y[count] }, 400);
      
      
        
    });
    });


</script>


<body>
<div id="wrap">
                  <ul  id="nav">
     	            <li id="first" class="active">Главная</li>
                	<li id="second">Предложение</li>
                	<li id="theird">Качество</li>
                	<li id="foure">Клиенты</li>
                	<li id="five">Доставка</li>
                  </ul>

</div>
</body>
</html>

Последний раз редактировалось Zugelman; 10.10.2014 в 11:17. Причина: опечатки
Zugelman вне форума Ответить с цитированием
Старый 09.10.2014, 14:13   #2
Zugelman
Пользователь
 
Регистрация: 08.04.2009
Сообщений: 50
По умолчанию

Может кто проверит на своей mozzile? Мне любой совет подойдет))
Zugelman вне форума Ответить с цитированием
Старый 09.10.2014, 14:33   #3
lux16
Форумчанин
 
Аватар для lux16
 
Регистрация: 11.02.2009
Сообщений: 305
По умолчанию

Для того чтобы кто-то это проверил надо чтобы был рабочий пример. Никто не будет ради тебя создавать страничку, а затем вставлять туда этот код
Хочу быть лучшим, но пока что я только обычный =(
lux16 вне форума Ответить с цитированием
Старый 09.10.2014, 15:17   #4
Zugelman
Пользователь
 
Регистрация: 08.04.2009
Сообщений: 50
По умолчанию

Цитата:
Сообщение от lux16 Посмотреть сообщение
Для того чтобы кто-то это проверил надо чтобы был рабочий пример. Никто не будет ради тебя создавать страничку, а затем вставлять туда этот код
А как добавить файл?
Zugelman вне форума Ответить с цитированием
Старый 09.10.2014, 18:14   #5
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от Zugelman Посмотреть сообщение
А как добавить файл?
юзай jsfiddle.net
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 09.10.2014, 21:44   #6
Zugelman
Пользователь
 
Регистрация: 08.04.2009
Сообщений: 50
По умолчанию

http://jsfiddle.net/qfzhm073/
Смотрите на рабочий пример, я немного его усовершенствовал, но суть вопроса остается.
В общем обратите внимание на строчку
Код:
var num = $("body").scrollTop();
в браузерах IE и Mozilla переменная num возвращает ноль.
а если записать так:
Код:
var num = $("html,body").scrollTop();
то num во всех браузерах возвращает ноль. т.е
работает корректно только первая половина кода(т.е плавная перемотка) а класс active не изменяется.

Последний раз редактировалось Zugelman; 09.10.2014 в 22:03.
Zugelman вне форума Ответить с цитированием
Старый 10.10.2014, 02:14   #7
Zugelman
Пользователь
 
Регистрация: 08.04.2009
Сообщений: 50
По умолчанию

Как можно заменить конструкцию
Код:
var num = $("body").scrollTop();
???
она не работает кроссбраузерно((( Помогите советом!
Мне нужно узнать позицию скролла относительно всей страницы.
Zugelman вне форума Ответить с цитированием
Старый 10.10.2014, 02:17   #8
Arigato
Высокая репутация
СуперМодератор
 
Аватар для Arigato
 
Регистрация: 27.07.2008
Сообщений: 16,219
По умолчанию

Firefox 32.0.3, ваш пример работает, при щелчке по пунктам менюшки прокрутка плавно переметывается вниз.
Arigato вне форума Ответить с цитированием
Старый 10.10.2014, 09:24   #9
Zugelman
Пользователь
 
Регистрация: 08.04.2009
Сообщений: 50
По умолчанию

Цитата:
Сообщение от Arigato Посмотреть сообщение
Firefox 32.0.3, ваш пример работает, при щелчке по пунктам менюшки прокрутка плавно переметывается вниз.
прокрутка да. А если скролить(не важно как, ползунком или колесиком мышки) нужный пункт меню не подсвечивается. попробуйте в другом браузере, например опера, там пункты меняются при прокрутке
Zugelman вне форума Ответить с цитированием
Старый 10.10.2014, 09:29   #10
Arigato
Высокая репутация
СуперМодератор
 
Аватар для Arigato
 
Регистрация: 27.07.2008
Сообщений: 16,219
По умолчанию

У меня всегда выделена Главная (хоть кликать, хоть скролить). В Опере аналогично. В Сафаре и Хроме пункты подсвечивает.
Arigato вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Css стиль не работает на Internet Explorer! T1pp HTML и CSS 4 18.03.2016 15:35
не работает javascript в internet explorer 9 warwarwar JavaScript, Ajax 3 04.03.2013 08:32
Процесс explorer.exe не работает и перегружает ЦП (Windows 7) Npwas Операционные системы общие вопросы 2 19.07.2012 19:43
Не работает флеш в Internet Explorer stepavia JavaScript, Ajax 0 11.11.2011 01:50
Css меню не работает в Internet Explorer CoDaJJe HTML и CSS 0 27.08.2009 21:16