Как создать красивое изображение, выгружаемое при помощи mootools? - PullRequest
0 голосов
/ 20 мая 2010

Я создаю веб-сайт для фотографа, который хотел бы, чтобы на его изображениях было хорошее изображение. Я исключил flash в качестве решения и хотел бы использовать эти прекрасные эффекты mootools fx. Но проблема в том, что я действительно паршив, когда дело доходит до JavaScript. Так что, если бы кто-нибудь мог дать мне простое решение для выцветания одной загрузки изображения, и когда изображение загружено, я был бы очень счастлив. Я знаю, что есть много разных людей, которые имеют это. Но проблема в том, что я не знаю, как работает код, даже если это полное решение. Так что самое главное. Если бы у кого-то было время объяснить, что делает каждая строка кода, я был бы более чем благодарен. Спасибо!

1 Ответ

4 голосов
/ 21 мая 2010

Простое появление, безусловно, самое простое, что можно себе представить:

// set-up an event on the browsers window
window.addEvents({

    // be sure to fire the event once the document is fully loaded
    load: function(){

        // assing 'singleImage' variable to the image tag with the 'image' ID
        var singleImage = $('image');

        // set a bunch of CSS styles to the aforementioned image
        singleImage.set('styles', {
            'opacity': 0,
            'visibility': 'visible'
        });

        // fade in the image
        singleImage.fade('in');
    }
});​

Рабочий пример: http://jsfiddle.net/oskar/RNeS5/ (HTML, CSS, MooTools)

...