Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 23.08.2012, 20:09
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

cyber,
Нет -
У тьву две картинки - плохая и хорошая
Текущая 1.9мега,
Воть нун сделать поплоше - такого же размера ,но с меньшей четкостью
дабы её начальный объем был 700 -780КБ
(есть сервисы в инете) или закомый фотошопер (у мну памяти не зватат - пытался помочь)

Когда перемещаешь - перемещаешь плохую - брауз тратит менее энергии на рендинг такой картинки - двигать 2 мега или 700кил, как остановился ( более чем на о.3-.4сек подсовываешь качественную

Последний раз редактировалось Deff, 23.08.2012 в 20:12.
Ответить с цитированием
  #12 (permalink)  
Старый 23.08.2012, 20:13
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

я не пойму просто как будет двигатся карта под картинкой, я так понял нужно сделать что бы они синхронно двигались?
Ответить с цитированием
  #13 (permalink)  
Старый 23.08.2012, 20:20
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

cyber,
нет ты хорошую карту изымыешь (меняешь ссылку) на плохую
Ответить с цитированием
  #14 (permalink)  
Старый 23.08.2012, 20:20
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

самое странное что если картинку не увеличивать а сразу поставить в макс размер то при перемещение тормозов нет
Ответить с цитированием
  #15 (permalink)  
Старый 23.08.2012, 20:23
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

на странице сразу подгружены три картинки
Одна в самой карте(изначально "хорошая"
(И Две скрыты z-index:200) это хорошая и "плохая"
- это фишка чтобы картинки не переподгружать
Ответить с цитированием
  #16 (permalink)  
Старый 23.08.2012, 20:24
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от cyber
самое странное что если картинку не увеличивать а сразу поставить в макс размер то при перемещение тормозов нет
Ну дык вставь сперва уменьшенную дождись подгрузки большой и замени
Ответить с цитированием
  #17 (permalink)  
Старый 23.08.2012, 22:38
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Отображать (рендерить) надо через window.requestAnimationFrame
Вместо style.left и style.top надо использовать style.transform = translate(x,y);
Ответить с цитированием
  #18 (permalink)  
Старый 24.08.2012, 00:17
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

Сообщение от melky Посмотреть сообщение
Отображать (рендерить) надо через window.requestAnimationFrame
Вместо style.left и style.top надо использовать style.transform = translate(x,y);
да да да=)
я 2 дня не мог понять почему гугл и другие подобные скрипты юзают translate=)
кстати а подругому можно получит текущие значение translate
var translate = wrapper[0].style.WebkitTransform.match(/(-[0-9]|[0-9])+/ig);
Ответить с цитированием
  #19 (permalink)  
Старый 24.08.2012, 00:47
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

Сообщение от melky Посмотреть сообщение
Отображать (рендерить) надо через window.requestAnimationFrame
не могу найти инфу как это делается=(
Ответить с цитированием
  #20 (permalink)  
Старый 24.08.2012, 01:36
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

угу, зачем нужен window.requestAnimationFrame , я понял написав по быстро простенькую анимацию
http://learn.javascript.ru/play/tlW2j
<!DOCTYPE HTML>
<html>
  <head> 
  
    <style>
      *{margin:0;}
      
      .square {
        width:50px;
        height:50px;
        position:absolute;
        background-color:black;
      
      }
    
    </style>
    
   <script>
     
    if ( !window.requestAnimationFrame ) {

  window.requestAnimationFrame = ( function() {
    return window.webkitRequestAnimationFrame ||
    window.mozRequestAnimationFrame ||
    window.oRequestAnimationFrame ||
    window.msRequestAnimationFrame ||
    function( /* function FrameRequestCallback */ callback, /* DOMElement Element */ element ) {

      window.setTimeout( callback, 1000 / 60 );

    };

  })();
} 
    </script> 
  </head>
  <body>
    <div class='square'></div>
    <div style='top:70px;'  class='square'></div>
    
    <script>
  
    var elem = document.getElementsByClassName('square');
     
     
   function app (elem,fnc) {
      
      var i = 0;
      var back = false; 
     
     (function animate () {
      elem.style.left= i+'px';
       
       if (i >= 500 || back) {
         
         back = true;
         
         i--;
       }
     
       if (!back || i == 0)  {
      
       back = false;
       i++;
       } 
      
       fnc(animate);
     }());
      
      }

app (elem[0], window.requestAnimationFrame);
app(elem[1],function ( callback,  element ) {

      window.setTimeout( callback, 1000 / 60 );

    })     
    </script>

  </body>
</html>

вопрос в другом как это поможет в моем случае?
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
drag & drop , html 5 cyber Events/DOM/Window 1 30.06.2012 15:16
Помогите с drag and drop shtopor jQuery 1 20.02.2012 13:26
Разбираюсь с drag and drop uaNikita Events/DOM/Window 4 22.09.2011 11:25
Drag & Drop с несколькими элементами Katz Общие вопросы Javascript 1 29.07.2011 13:01
Drag & Drop в полном объеме dizews Events/DOM/Window 3 26.07.2007 12:43