Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.10.2010, 17:17
Интересующийся
Отправить личное сообщение для Леночка Посмотреть профиль Найти все сообщения от Леночка
 
Регистрация: 28.09.2010
Сообщений: 15

хоровод картинок
как сделать чтобы каждые пол секунды цикл продолжил свое движение по часовой стрелке?



<html>
<head>
<title></title>
<script language="JavaScript">
function mouse()
{
mouse1.style.pixelLeft+=3
mouse1.style.pixelTop+=3
id=window.setTimeout("mouse()",1)
if(mouse1.style.pixelLeft>297&&mouse1.style.pixelT op>197)
{
clearTimeout(id)
}
x()
}
function x()
{
mouse3.style.pixelLeft-=3
mouse3.style.pixelTop+=3
id1=window.setTimeout("mouse1()",1)
if(mouse3.style.pixelLeft<403&&mouse3.style.pixelT op>397)
{
clearTimeout(id1)
}
y()
}
function y()
{
mouse2.style.pixelLeft-=3
mouse2.style.pixelTop-=3
id2=window.setTimeout("mouse2()",1)
if(mouse2.style.pixelLeft<203&&mouse2.style.pixelT op>353)
{
clearTimeout(id2)
}
z()
}
function z()
{
mouse4.style.pixelLeft+=3
mouse4.style.pixelTop-=3
id3=window.setTimeout("mouse3()",1)
if(mouse4.style.pixelLeft<97&&mouse4.style.pixelTo p<247)
{
clearTimeout(id3)
}
}

</script>
</head>
<body onLoad="mouse()">
<img src="10.gif" width=100 height=150 style="position:absolute;top:0;left:250" id=mouse1>
<img src="11.gif" width=100 height=150 style="position:absolute;top:400;left:250" id=mouse2>
<img src="12.gif" width=100 height=150 style="position:absolute;top:200;left:450" id=mouse3>
<img src="13.gif" width=100 height=150 style="position:absolute;top:200;left:50" id=mouse4>
<script>
</script>
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 04.10.2010, 17:30
Профессор
Отправить личное сообщение для Sweet Посмотреть профиль Найти все сообщения от Sweet
 
Регистрация: 16.03.2010
Сообщений: 1,618

1. Первый день замужем что ли? Почему код неотформатирован???
2. Спроси на той помойке, где был найден сей скриптишко.
Ответить с цитированием
  #3 (permalink)  
Старый 06.10.2010, 09:55
Аспирант
Отправить личное сообщение для MikhailGirshberg Посмотреть профиль Найти все сообщения от MikhailGirshberg
 
Регистрация: 27.07.2010
Сообщений: 72

ёрзают мышки
Сообщение от Sweet Посмотреть сообщение
1. Первый день замужем что ли? Почему код неотформатирован???
2. Спроси на той помойке, где был найден сей скриптишко.
Спрашиваете, как с больного здоровье. К тому же псы брешут деликатнее. Противно. А ещё профессор...

Сообщение от Леночка Посмотреть сообщение
как сделать чтобы каждые пол секунды цикл продолжил свое движение по часовой стрелке?
По секунде вот так. Иллюстрирует скорее общие принципы подходов, чем результат в дизайнерском смысле.

Для получения более ровной картинки следует пересчитывать координаты не для левого-верхнего угла, а для центра объекта. Движение по прямой тоже не самый лучший вариант. Зато простой, легко показать.
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Ёрзают мышки ;-? </title>
    <script type="text/javascript">

      // Одна функция на все однотипные действия с объектом
      function mouse(){
        // переменные для значения шага по горизонтали и вертикали
        var horstep, verstep
        // этот цикл переберёт однотипные объекты
        for(var i = 1; i < 5; ++i){
          // получаем объект по Id
          var mnode = document.getElementById("mouse" + i)
          // значения границ с отсечённым суффиксом размерности ("px")
          var left = parseInt(mnode.style.left)
          var top = parseInt(mnode.style.top)

          // алгоритм назначения величин шагов может быть сложнее
          if(top >= 200) horstep = -3   // в нижней половине области ёрзаем влево
          else horstep = 3  // наверху - вправо
          if(left >= 250) verstep = 3 // в правой половине области едем вверх
          else verstep = -3 // слева - вниз

          // снова собираем величину для границы
          mnode.style.top = top + verstep + "px"  //  Величина должна быть строкой из числа и суффикса
          mnode.style.left = left + horstep + "px"  //  сначала вычисляется число, затем происходит конкатенация

        }
        setTimeout(mouse, 1000) //  повторим через секунду
      }

    </script>
    <style type="text/css">
      img{/*стиль картинки задаёт её размер*/
        width: 100px;
        height: 150px;
      }
      div {/*позиция определяется вмещающим блоком*/
        position: absolute;
        border: solid gray 1px;/*рамка необязательна.
                               Даёт наглядность в отсутствии картинок*/
      }
    </style>
  </head>
  <body>
    <!--элементы спрятаны во вмещающие блоки-->
    <div id="mouse1" style="top:0;left:250px">
      <img alt="mouse1" src="10.gif" />
      <!--Управлять стилями вмещающих блоков удобнее,
      чем свойствами картинок напрямую-->
    </div>
    <div id="mouse2" style="top:400px;left:250px"><img alt="mouse2" src="11.gif"/></div>
    <div id="mouse3" style="top:200px;left:450px"><img alt="mouse3" src="12.gif"/></div>
    <div id="mouse4" style="top:200px;left:50px"><img alt="mouse4" src="13.gif"/></div>
    <script type ="text/javascript">
      mouse() // скрипт в конце документа - хорошая альтернатива обработчику события onLoad
    </script>
  </body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 06.10.2010, 10:01
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от MikhailGirshberg
А ещё профессор...
По вашему профессор послать не может?
Ответить с цитированием
  #5 (permalink)  
Старый 06.10.2010, 10:40
Аспирант
Отправить личное сообщение для MikhailGirshberg Посмотреть профиль Найти все сообщения от MikhailGirshberg
 
Регистрация: 27.07.2010
Сообщений: 72

Сообщение от Kolyaj Посмотреть сообщение
По вашему профессор послать не может?
ИМХО, фундаментальное отличие правильного профессора заключается в умении даже послать... конструктивно. Чтобы пошли учиться, а не "нафиг" ;-?
Ответить с цитированием
  #6 (permalink)  
Старый 06.10.2010, 10:44
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

А с чего вы взяли, что статусы на этом форуме имеют какое-то отношение к профессорам?
Ответить с цитированием
  #7 (permalink)  
Старый 06.10.2010, 14:29
Аспирант
Отправить личное сообщение для MikhailGirshberg Посмотреть профиль Найти все сообщения от MikhailGirshberg
 
Регистрация: 27.07.2010
Сообщений: 72

Сообщение от Kolyaj Посмотреть сообщение
А с чего вы взяли, что статусы на этом форуме имеют какое-то отношение к профессорам?
Просто скромная надежда, что "профессор этого форума" станет вести себя на этом форуме "как профессор".
Такая ошибка вызывается "асимметричным дуализмом языкового знака", да? И уж точно, что завязавшаяся дискуссия не имеет отношения к теме!
Ответить с цитированием
  #8 (permalink)  
Старый 06.10.2010, 15:08
Профессор
Отправить личное сообщение для Sweet Посмотреть профиль Найти все сообщения от Sweet
 
Регистрация: 16.03.2010
Сообщений: 1,618

MikhailGirshberg, видимо, ты живешь в мире, где каждый обязан вести себя, общаться и одеваться в соотвестсвии с социальным положением. Однако подобрые нормы не естественны, а являются порождением современного социума и современной организации внутри него. Поэтому не вижу оснований отторгать людей, не соответствующих твоему представлению о том, как они должны быть. Мы же все-таки в 21 веке живем
Так же хочу заметить, что действительно умные (не просто эрудированные) люди часто очень эксцентричны
Ответить с цитированием
  #9 (permalink)  
Старый 06.10.2010, 23:11
Интересующийся
Отправить личное сообщение для Леночка Посмотреть профиль Найти все сообщения от Леночка
 
Регистрация: 28.09.2010
Сообщений: 15

MikhailGirshberg, Большое спасибо за КОНСТРУКТИВНЫЙ ответ буду надеяться что на этом сайте из аспиранта скоро вырастит мудрый профессор
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Смена картинок с ссылкой hk80 Общие вопросы Javascript 3 08.04.2010 17:09
Прелоуд картинок не работает в Опере Arseo Opera, Safari и др. 3 20.11.2009 19:45
Java ScrollTo. Скрол картинок на java. Надо подправить. vdm Ваши сайты и скрипты 1 28.10.2009 20:46
Java ScrollTo. Скрол картинок на java. Надо подправить. vdm Работа 0 27.10.2009 14:57
Как сделать прокрутку картинок Lugan Элементы интерфейса 1 26.06.2009 12:52