Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.06.2012, 21:50
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 16.12.2011
Сообщений: 4,415

чертовщина с Math.max
есть код
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<style>
body {
  padding: 10px
}

.carousel {
  position: relative;
  width: 398px;
  padding: 10px 40px;
  border: 1px solid #CCC;
  border-radius: 15px;
  background: #eee;
}
.carousel img {
  width: 130px;
  height: 130px;
  display: block; /* если не поставить block, в ряде браузеров будет inline -> лишнее пространтсво вокруг элементов */
}
.carousel .arrow {
  position: absolute;
  top: 57px;
  padding: 3px 8px 8px 9px;
  background: #ddd;
  border-radius: 15px;
  font-size: 24px;
  color: #444;
  text-decoration: none;
}

.carousel .arrow:hover {
  background: #ccc;
}
.carousel .left-arrow {
  left: 7px;
}
.carousel .right-arrow {
  right: 7px;
}
.galery {
  width: 390px;
  overflow: hidden;
}
.galery ul {
  height: 130px;
  width: 9999px;
  margin: 0;
  padding: 0;
  list-style: none;
  -webkit-transition:all 1s ease;
}

.galery ul li {
	float: left;
}

</style>
</head>

<body>

<div class="carousel">
<a href="#" class="arrow left-arrow" id="prev">‹ </a>
  <div class="galery">
    <ul id="images">
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/1.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/2.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/3.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/4.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/5.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/6.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/7.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/8.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/9.png"></li>
      <li><img src="http://ru.lookatcode.com/show/9635578938759863/10.png"></li>
    </ul>
  </div>
<a href="#" class="arrow right-arrow" id="next">› </a>
</div>

<script>

/* этот код помечает картинки, для удобства разработки */
var lis = document.getElementsByTagName('li');
for(var i=0; i<lis.length; i++) {
  lis[i].style.position='relative';
  var span = document.createElement('span');
  // обычно лучше использовать CSS-классы,
  // но этот код - для удобства разработки, так что не будем трогать стили
  span.style.cssText='position:absolute;left:0;top:0';
  span.innerHTML = i+1;
  lis[i].appendChild(span);
}

/* конфигурация */
var width = 130; // ширина изображения
var count = 3; // количество изображений

var ul = document.getElementById('images');
var imgs = ul.getElementsByTagName('li');

var position = 0; // текущий сдвиг влево

document.getElementById('prev').onclick = function() {
  if (position >= 0) return false; // уже до упора

  // последнее передвижение влево может быть не на 3, а на 2 или 1 элемент
  position = Math.min(position + width*count, 0)
  ul.style.marginLeft = position + 'px';
  return false;
}

document.getElementById('next').onclick = function() {
  if (position <= -width*(imgs.length-count)) return false; // уже до упора

  // последнее передвижение вправо может быть не на 3, а на 2 или 1 элемент
  position = Math.max(position-width*count, -width*(imgs.length-count));
 
  ul.style.marginLeft = position + 'px';
  alert(Math.max(position-width*count, -width*(imgs.length-count)) + "   "+position);
//вот тут не могу понять почему в position одно значение а Math.max возвращает другое

  return false;
};

</script>
</body>
</html>

проблема в 67 строке

Последний раз редактировалось cyber, 20.06.2012 в 22:03.
Ответить с цитированием
  #2 (permalink)  
Старый 20.06.2012, 22:04
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 16.12.2011
Сообщений: 4,415

поправил код теперь запускается нормально..
Ответить с цитированием
  #3 (permalink)  
Старый 20.06.2012, 22:08
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,234

Сообщение от cyber
//вот тут не могу понять почему в position одно значение а Math.max возвращает другое
потому что ни один из аргументов Math.max не равен position
Ответить с цитированием
  #4 (permalink)  
Старый 20.06.2012, 22:11
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 16.12.2011
Сообщений: 4,415

не совсем понял, т.е оно сравнивает результат Math.max c position?
Ответить с цитированием
  #5 (permalink)  
Старый 20.06.2012, 22:12
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,234

Сообщение от cyber
т.е оно сравнивает результат Math.max c position?
кто оно?
в вашем коде никто не сравнивает результат Math.max c position
Ответить с цитированием
  #6 (permalink)  
Старый 20.06.2012, 22:14
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 16.12.2011
Сообщений: 4,415

сорри что туплю но реально не могу догнать..
как я знаю Math.max возвращает самое большое число из переданных
Ответить с цитированием
  #7 (permalink)  
Старый 20.06.2012, 22:23
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,234

Сообщение от cyber
как я знаю Math.max возвращает самое большое число из переданных
Да
вы ему передаете два числа
position-width*count
-width*(imgs.length-count)
ни одно из этих чисел не равно числу position
Ответить с цитированием
  #8 (permalink)  
Старый 20.06.2012, 22:29
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 16.12.2011
Сообщений: 4,415

Сообщение от Gvozd Посмотреть сообщение
Да
вы ему передаете два числа
position-width*count
-width*(imgs.length-count)
ни одно из этих чисел не равно числу position
а если равно то возвращает максимальное , что ли?
Ответить с цитированием
  #9 (permalink)  
Старый 20.06.2012, 23:22
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 16.12.2011
Сообщений: 4,415

блин второй час голову ломаю
ну вот к примеру все работает как и должно
var i = 10;
 i = Math.max(i - 7,5);
      alert(i);

что такого в том примере?
Ответить с цитированием
  #10 (permalink)  
Старый 21.06.2012, 00:06
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,234

Сообщение от cyber
что такого в том примере?
119 и 122 строка
в рамках твоего простого примера это выглядит так:
var i = 10;
i = Math.max(i - 2, 5);//8 и 5 - максимальное 8
alert(Math.max(i - 2, 5) + ' ' + i);//так как i уже равно 8, то максимум выбирается из 8-2 и 5, и максимум равен 6. а i все еще равно 8
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
body.innerhtml - что за чертовщина? andy_quarry Ваши сайты и скрипты 6 19.07.2011 01:41