13.02.2017 19:50
DiphenylOxalate 31 4900 Источник
Представляю вашему вниманию новейший плагин FadeSlide, который перевернёт ваше представление о веб-разработке! При размере всего 87 байт он творит настоящие чудеса.

Демо-страничка: FadeSlide UI
> Uncompressed, development FadeSlide UI 4.0 (132b)
> Compressed, produciton FadeSlide UI 4.0 (87b)

Синтаксис очень прост:

fadeslide($(".element"), function() {alert("Done!")});

История версий:

1.0 — оригинальный плагин SlideFade
2.0 — название изменено на FadeSlide
2.1 — добавлено слово UI для большей солидности
3.0 — исправлена опечатка (лишняя скобка), из-за которой все предыдущие версии FadeSlide UI выдавали SyntaxError
4.0 — добавлена возможность назначать callback

В разработке:

4.1 — планируется ввести возможность добавлять два, а то и три callback-функции
Поделиться с друзьями
-->

Комментарии (31)


  1. Andrey_Volk
    13.02.2017 23:14
    #10068532
    +5

    История версий улыбнула, как и сама статья. Спасибо за поднятое настроение в рабочее время :)


    1. Andrey_Volk
      13.02.2017 23:59
      #10068598
      +2

      з.ы. надеюсь вы в 5 версии добавите наконец приставку «v» для версии, а то не слишком солидно)


  1. raveclassic
    13.02.2017 23:44
    #10068578
    +3

    Ничего не понимаю, ведь не пятница же… :)


  1. MetaDone
    14.02.2017 00:25
    #10068636

    Представляю вашему вниманию новейший плагин FadeSlide, который перевернёт ваше представление о веб-разработке!

    ээээ… и это все чтоль?


  1. Rastishka
    14.02.2017 01:27
    #10068668
    +4

    Выложите на гитхаб пожалуйста.


  1. scronheim
    14.02.2017 07:02
    #10068810
    +4

    Вам бы в твиттер, а не на хабр


  1. shpaker
    14.02.2017 08:18
    #10068848
    +5

    >> плагин FadeSlide, который перевернёт ваше представление о веб-разработке
    Спасибо. Перевернуло.
    А вообще статья огонь. Прекрасно всё.


    1. m0sk1t
      14.02.2017 11:02
      #10069134

      Точно перевернуло? Может вывернуло? =)


      1. shpaker
        16.02.2017 09:01
        #10073884

        Ну что такое, да


  1. AstarothAst
    14.02.2017 09:03
    #10068884
    +5

    Зачем это на хабре? Я серьезно. Вроде бы даже не первое апреля.


  1. Rad1calDreamer
    14.02.2017 09:30
    #10068930
    +2

    Как в обратную сторону мое «представление о веб-разработке» перевернуть?


  1. mihmig
    14.02.2017 10:23
    #10069042
    +5

    Особо порадовали blok,kuda, kolbek. Давно таких не встречал…


  1. kovalevsky
    14.02.2017 10:28
    #10069050
    +2

    Очень хочу в использовать в продакшене, а тестами не покрыто что-ли? А npm пакет?


  1. Feramon4ik
    14.02.2017 10:56
    #10069104
    +2

    function fadeslide(kuda, kolbek) {
    $(kuda).click(function () {
        $(kuda).animate({
            height : 0,
            opacity: 0
        });
    });
    kolbek();
}

    Это гениально!


    1. defaultvoice
      14.02.2017 11:19
      #10069190

      Надо только оформить в виде плагина

      (function($){
  $.fn.fadeSlide = function(kolbek) {
    return this.on('click', function(e) {
      $(this).animate({
        height : 0,
        opacity: 0
      }, 400, kolbek)
  });
};
})(jQuery);


      Не нашел, куда прислать pull request :(


      1. TheShock
        15.02.2017 18:47
        #10073144

        Ваш код не соблюдает code-guides данного плагина, потому PR все-равно не примут


  1. mcflys
    14.02.2017 10:56
    #10069106
    +1

    fadeslide.js:

    fadeslide(kuda, kolbek)

    Okay


  1. eXtReeM
    14.02.2017 10:56
    #10069108

    И в npm добавьте.


  1. GriNAME
    14.02.2017 10:56
    #10069110

    О класс! Плагин и правда перевернул мое представление о веб разработке. Теперь я пошел переворачивать представление заказчиков о их заказах.


  1. MGames
    14.02.2017 10:56
    #10069112
    +1

    добавлено слово UI для большей солидности

    Думал, что после этого ничего веселее уже не может быть, но тут увидел ченжлог версии 3.0


  1. Krasnodar_etc
    14.02.2017 10:56
    #10069114

    Супер! По ссылке одна из лучших документаций, что я видел.

    Требую github


  1. maxvape
    14.02.2017 10:56
    #10069116

    Автор, лицензия какая? Форкать можно?


  1. vwv
    14.02.2017 10:56
    #10069120

    Огонь! Некоторое время пытался найти код плагина через консоль, по привычке перед использованием, когда понял, что эти 5 строк и есть все творчество, поржал. Похоже на хорошо исполненный стеб)


  1. makcums
    14.02.2017 11:12
    #10069162

    image
    сломалось :(


  1. ChALkeRx
    14.02.2017 11:28
    #10069220

    Но ещё февраль же.


  1. AHDPEu
    14.02.2017 13:09
    #10069472

    Не хватает промисов и es6 версии. А так годно, использую в проде ещё с версии 2.1.


  1. XeL077
    14.02.2017 13:32
    #10069520

    Забыли одну проверку.Такое в twitter постить, можно.


  1. technokid
    14.02.2017 13:32
    #10069522

    А FadeToggle будет?


  1. rijk
    14.02.2017 13:32
    #10069526

    Огромное спасибо, это именно то что я искал


  1. Zavtramen
    14.02.2017 22:38
    #10070970

    А никого не смущает, что колбек выстрелит при навешивании обработчика, а не при окончаниия анимации? Сыровато пока, ждем 5й версии, надеюсь поправят.


    1. raveclassic
      14.02.2017 22:45
      #10070988
      +1

      Это будет в Ultimate Edition