Панорама на сайте - как реализовать?

M2
На сайте с 11.01.2011
Offline
341
656

Обращаюсь за помощью, поскольку никогда с таким не сталкивался. Суть такая... есть изображение очень большое по ширине - около 4000 px. Я его уместил (жёстко) в заданные параметры (912*390). Это изображение требуется медленно поворачивать вокруг своей оси... ну грубо говоря, на загрузку страницы повесить некую function.... которая будет крутить image постоянно... Раньше это была флешка, там всё было реализовано. Но из-за проблем с одним параметром, решено было от флеш отказаться и реализовать то же самое скриптом.

Одно НО: это требуется сделать на mootools, а не на jquery. ибо весь сайт будет основан на Mootools и, скорее всего, если туда вкрутить второй фреймворк будут конфликты. А во-вторых - сама мутулза весит около 350 кил. Плюс jQuery - не вариант даже в плане оптимизации.

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

Всем заранее спасибо за любую помощь. Готов отвечать на любые вопросы :))

mark2011 добавил 18.02.2011 в 15:16

Описанное можно увидеть на сайте http://nndevice.ru

------------------- Крутые VPS и дедики. Качество по разумной цене ( http://cp.inferno.name/view.php?product=1212&gid=1 ) VPS25OFF - скидка 25% на первый платеж по ссылке выше
neznaika
На сайте с 28.06.2006
Offline
356
#1

Всё это будет тупить и лагать при таких размерах. Пользователи будут материться и убегать.

Дорого покупаю настоящие сайты. Не инвестирую деньги и не беру кредиты.
M2
На сайте с 11.01.2011
Offline
341
#2

neznaika

Блин, даже если так, во-первых это не ответ... хотя оправдывает ваш ник... во-вторых это не мои проблемы. Моё дело это реализовать, я у народа интересуюсь, как можно это сделать с помощью MooTools.

S0
На сайте с 20.11.2010
Offline
32
#3

<marquee behavior="Alternate">

<img src="img.png" alt="панорама" width="4000" height="400" />

</marquee>

M2
На сайте с 11.01.2011
Offline
341
#4

А кроссбраузерно? И потом не покатит, у меня этот img как бэкграунд идёт. И там ещё одна проблема есть: у этого дива z-index=0. Из-за этого никакие события DOM на него не действуют. Если поставить больший z-index, тогда всё нормально, но бэкграунд позиционируется не так, как мне нужно. Вот... и как это обойти я пока не знаю... разве что на <body onload что-то поставить... так, по идее, и надо...

C
На сайте с 28.01.2010
Offline
70
#5
mark2011:

Одно НО: это требуется сделать на mootools, а не на jquery. ибо весь сайт будет основан на Mootools и, скорее всего, если туда вкрутить второй фреймворк будут конфликты. А во-вторых - сама мутулза весит около 350 кил. Плюс jQuery - не вариант даже в плане оптимизации.

Ну во-первых он у вас даже не минифицирован, поэтому и такой размер, во-вторых есть jquery.noconflict


<script>
function start(position) {
document.getElementById("panorama").style.backgroundPosition = '-'+position+'px 0px';
position++;
if (position > 3874) {
position = 0;
}
delay_start(position);
}

function delay_start(position) {
setTimeout('start('+position+')', 5);
}
</script>

<a href="javascript:start(0);">start</a>
<div id="panorama" style="width: 403px; height: 403px; z-index:0; position:absolute; background: url(http://nndevice.ru//images/flash_picture.jpg); background-position: 0px 0px"></div>
Это - личная подпись. Здесь обычно ставят ссылки на всякие кривые сайты, надеясь получить "жирный бек".

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий