Плавающий значок Twitter на странице прокрутки

Question

Подскажите, пожалуйста, как этому веб-сайту удалось это сделать?

http://weblopedi.net/

Вокруг веб-страницы плавает птица Twitter (не случайно) Когда я прокручиваю вниз, птица следует за мной и летает вокруг:)

Есть ли для этого плагин?

Обновление: я только что обнаружил, что это гаджет Wordpress. Но как я могу использовать его на своем веб-сайте (не блоге)? В любом случае, я посмотрю на исходный код.

Answer 1

Быстрый ответ - установить div или элемент в абсолютное положение и дать ему более высокий z-индекс, чем на остальной части страницы, по которой вы хотите, чтобы он перемещался.Затем управляйте им с помощью Javascript в событии прокрутки окна.Например, если вы используете jQuery, вы можете использовать scrollTop () и иметь смещение для установки положения y плавающей птицы в твиттере.

Что-то вроде:

<div id="BirdDiv" style="position: absolute; z-index: 999;">
     <img src="twitterbird.png" alt="" />
</div>

Затем в Javascript

$(window).scroll(function () {
    var offset = 150;
    var topVal = $(window).scrollTop() + offset;
    $("#BirdDiv").offset({ top: topVal, left: 300 });
});