ФорумПрограммированиеПыхнуть хотите?Готовые решения → Альтернативный текст для картинов а-ля тултип, или jAlt... XD

Альтернативный текст для картинов а-ля тултип, или jAlt... XD

  • technobulka

    Сообщения: 4552 Репутация: N Группа: Джедаи

    Spritz 16 сентября 2010 г. 22:38

    выпадающая подсказка при наведении на картинку с каким-то действием конечно норм смотрится, но я решил сделать по-другому)) расценивайте это как "Стасовскому нечего делать. Дубль три."))

    теперь по теме…
    к примеру у нас есть несколько таких картиночек с действиями какого-то редактирования
    <a href=&quot;#&quot;><img src=&quot;img/add.png&quot; alt=&quot;добавить&quot; /></a>
    <a href=&quot;#&quot;><img src=&quot;img/accept.png&quot; alt=&quot;сохранить&quot; /></a>
    <a href=&quot;#&quot;><img src=&quot;img/16_tool_a.png&quot; alt=&quot;настройки&quot; /></a>
    <a href=&quot;#&quot;><img src=&quot;img/del.png&quot; alt=&quot;выход&quot; /></a>


    делаем финт ушами
    $(&#39;a img[alt]&#39;).jAlt();

    и вуа-ля! оно полетело!!! (см. демку)

    а вот и сам jAlt, собственной персоной))
    (function($) {
       $.fn.jAlt = function(options) {
           var defaults = {
                direction : 1, // 1 = вверх, 0 = вниз
               duration : 1000, // время полета
               delay : 0, // задержка перед полетом
               range : 20 // дальность полета
           },
           opts = $.extend(defaults, options);    
             
             this.bind(&#39;mouseover&#39;, function(e) {
               var t = $(this),
                   text = t.attr(&#39;alt&#39;),
                   posX = t.offset().left,
                   posY = t.offset().top + ( opts[&#39;direction&#39;] === 1 ? -15 : t.height() + 10 ),
                   ghost = $(&#39;<div class=&quot;jalt_ghost&quot;>&#39;+text+&#39;</div>&#39;);
                   
               if (text) {
                   $(&#39;body&#39;).append(ghost);
                   ghost
                       .css({
                           position : &#39;fixed&#39;,
                           zIndex : 1,
                           fontSize : 11,
                           fontFamily : &#39;monospace&#39;,
                           color : &#39;#000&#39;
                       })
                       .css({
                           left : posX-(ghost.width()-t.width())/2,
                           top : posY
                       })
                       .delay(opts[&#39;delay&#39;])
                       .animate({
                           top : posY + ( opts[&#39;direction&#39;] === 1 ? -opts[&#39;range&#39;] : opts[&#39;range&#39;] ),
                           opacity : 0
                       }, opts[&#39;duration&#39;], function(){
                           ghost.remove();
                       });
               }
           }).bind(&#39;mouseout&#39;, function() {
               $(&#39;.jalt_ghost&#39;).remove();
           });    
       };
    })(jQuery);


    демка - http://keyx.narod.ru/jalt/
    Высокоуровневое абстрактное говно
  • Givi

    Сообщения: ? Репутация: N Группа: Адекваты

    Spritz 17 сентября 2010 г. 0:45, спустя 2 часа 7 минут 5 секунд

    Ну разве что реально от нехуй делать, ибо конкретно к выполненной задаче сия функция нах не нужна.
  • technobulka

    Сообщения: 4552 Репутация: N Группа: Джедаи

    Spritz 17 сентября 2010 г. 6:27, спустя 5 часов 41 минуту 46 секунд

    ибо конкретно к выполненной задаче сия функция нах не нужна

    да пофигу)) прикольная хреновинка получилась))
    Высокоуровневое абстрактное говно
  • Абырвалг

    Сообщения: 6477 Репутация: N Группа: Джедаи

    Spritz 17 сентября 2010 г. 6:29, спустя 2 минуты 20 секунд

    забавно {+++10+++} я соскучился по жуйквери
  • technobulka

    Сообщения: 4552 Репутация: N Группа: Джедаи

    Spritz 17 сентября 2010 г. 6:31, спустя 1 минуту 52 секунды

    нах не нужна

    кстать, я больше не для необходимости, а для практики делал))

    забавно

    ну вот кому-то нравится))
    Высокоуровневое абстрактное говно
  • Givi

    Сообщения: ? Репутация: N Группа: Адекваты

    Spritz 17 сентября 2010 г. 9:05, спустя 2 часа 33 минуты 53 секунды

    Stasovsky, она-то прикольная, я ж не спорю. Просто нужно придумать более полезное применение ей. Но в целом молоток.
  • felix90

    Сообщения: ? Репутация: N Группа: Адекваты

    Spritz 17 сентября 2010 г. 9:49, спустя 43 минуты 40 секунд

    А мне нравится)
  • phpdude

    Сообщения: 26617 Репутация: N Группа: в ухо

    Spritz 17 сентября 2010 г. 9:54, спустя 5 минут 46 секунд


    А мне нравится)
    а мне чето не понравилось) альт должен быть читаемым, а не &quot;съябываемым&quot;)))))
    Сапожник без сапог
  • technobulka

    Сообщения: 4552 Репутация: N Группа: Джедаи

    Spritz 17 сентября 2010 г. 9:57, спустя 2 минуты 56 секунд

    альт должен быть читаемым, а не &quot;съябываемым&quot;

    дык там мона задержку сделать, а потом он съябываеццо)) а можно сделать, чтоб вааще не съябывалсо))
    Высокоуровневое абстрактное говно

Пожалуйста, авторизуйтесь, чтобы написать комментарий!