Полезная информация

Общайтесь со знакомыми и друзьями в нашей группе в Контакте.
  • Форумы
  •  » Сustom Buttons
  •  » [CB]Увеличивать размеры изображений из контекстного меню на странице

№5130-12-2013 03:18:33

bunda1
Moderator
 
Группа: Moderators
Откуда: Латвия
Зарегистрирован: 09-02-2010
Сообщений: 4811
UA: Firefox 3.6

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

voqabuhe пишет

Смотрю "Оно того не стоит" удалил. Появилась другое мнение? :)

:/

voqabuhe пишет

А нельзя сделать, чтобы картинка увеличивалась от центра равномерно во все стороны, а не только вниз и вправо?

Сделать можно постоянно перемещая при увеличении изображение относительно его старого центра. Тут нужен алгоритм такого перемещения и не понятно как получить координаты для такого перемещения.
Надо подумать.

Отредактировано bunda1 (30-12-2013 03:19:47)

Отсутствует

 

№5230-12-2013 13:59:09

voqabuhe
Участник
 
Группа: Members
Зарегистрирован: 06-12-2011
Сообщений: 3231
UA: Firefox 29.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1
Кстати увеличение колесом довольно хорошо реализовано в скрипте picViewer for Greasemonkey. Посмотри, может что-то почерпнёшь полезное.

Отредактировано voqabuhe (30-12-2013 14:15:41)

Отсутствует

 

№5330-12-2013 16:18:22

VORON
Участник
 
Группа: Members
Зарегистрирован: 03-04-2013
Сообщений: 158
UA: Firefox 24.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

voqabuhe
Скрипт интересный,но на китайском?/японском?Хоть бы английский был.Потому мне больше по-душе  Imagus с фильтрами от Rodny или тот же Mouseover Popup Image Viewer,для которого тоже фильтров хватает,даже здесь на форуме

Отсутствует

 

№5402-01-2014 22:51:30

bunda1
Moderator
 
Группа: Moderators
Откуда: Латвия
Зарегистрирован: 09-02-2010
Сообщений: 4811
UA: Firefox 3.6

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

voqabuhe пишет

А нельзя сделать, чтобы картинка увеличивалась от центра равномерно во все стороны, а не только вниз и вправо?

Вот попробуй с исправлениями от Dumby

Выделить код

Код:

(function () {
    var imgZoom = 170;    // на сколько увеличить изображение из меню
    var scrollZoom = 20;  // на сколько увеличивать/уменьшать колесиком мыши
    var scrollTop = 1;    // или -1, переключение направление прокрутки для увеличение колёсиком

    // добавить новый пункт в меню изображений
    var contextMenu = document.getElementById("contentAreaContextMenu");
    var menuitem = contextMenu.appendChild(document.createElement("menuitem")); // как последний пункт меню
    menuitem.setAttribute("label", "Увеличить размер ( test )");
    addDestructor(function() contextMenu.removeChild(menuitem));
    addEventListener("popupshowing", function() menuitem.hidden = !gContextMenu.onImage, false, contextMenu);

    var ar = Cc['@mozilla.org/accessibleRetrieval;1'].getService(Ci.nsIAccessibleRetrieval);
    ar.getAccessibleFor(gBrowser); // ... ...

    // если клик или команда на пункте меню
    menuitem.setAttribute("oncommand", "this.run();");
    menuitem.run = function() {
        var img = gContextMenu.target; // получить изображение

        // конвертировать изображение в base64 ....
        var canvas = document.createElementNS(xhtmlns, 'canvas');
        canvas.width = img.naturalWidth;
        canvas.height = img.naturalHeight;
        var ctx = canvas.getContext('2d');
        ctx.drawImage(img, 0, 0);
        var base64 = canvas.toDataURL();

        // создать и открыть всплывающую подсказку с увеличенным изображением над изображением .... 
        var tooltip = gBrowser.appendChild(document.createElement("tooltip")), tts = tooltip.style;
        tooltip.setAttribute("onpopuphiding", "event.preventDefault();");
        tts.cssText = "margin: 0; padding: 0; -moz-appearance: none !important; border: none; background: transparent; max-width: none";
        var image = tooltip.appendChild(document.createElement("image"));

        var acc = ar.getAccessibleFor(img);
        acc.QueryInterface(Ci.nsIAccessibleImage);
        var [ax, ay, aw, ah] = [{}, {}, {}, {}];
        acc.getImagePosition(Ci.nsIAccessibleCoordinateType.COORDTYPE_WINDOW_RELATIVE, ax, ay);
        acc.getImageSize(aw, ah);
        var rect = { left: ax.value, top: ay.value, width: aw.value, height: ah.value };

        var ratio = rect.height / rect.width;
        image.style.width = rect.width + imgZoom + "px";
        tooltip.openPopup(img, "topleft", -1, -1, false, false, null);
        tts.opacity = "0";

        image.onload = function() {
            var k = mozInnerScreenY < 0 ? -mozInnerScreenY : 0;

            var left = rect.left - (outerWidth - innerWidth) / 2 - imgZoom / 2;
            var top = rect.top - ratio * imgZoom / 2;
        
            if (left < 0) left = 0;
            if (top < k) top = k;
            var r = left + rect.width + imgZoom - innerWidth;
            if (r > 0) left -= r;
            var b = top + rect.height + ratio * imgZoom - innerHeight;
            if (b > 0) top -= b;

            tts.top = top + "px"; tts.left = left + "px";
            tts.position = "fixed"; tts.opacity = "";
        };
        image.setAttribute("src", base64);

        // прокрутка на подсказке меняет размеры изображения, на странице закрывает его ....
        function imageZoom(e) {
            if (e.target != image) { removeTooltip(); return; }

            var zoom = (e.detail < 0 ? scrollZoom : -scrollZoom) * scrollTop;
            var zx = zoom / 2, zy = zx * ratio;
            var rect = tooltip.getBoundingClientRect();
            var left = rect.left - zx, top = rect.top - zy;
        
            if (zoom > 0) {
                var k = mozInnerScreenY < 0 ? -mozInnerScreenY : 0;

                if (left - zx < 0 && rect.right < innerWidth) left = 0;
                var r = rect.right + zx - innerWidth;
                if (r > 0 && left > 0) left -= r;

                if (top < k && rect.bottom < innerHeight) top = k;
                var b = rect.bottom + zy - innerHeight;
                if (b > 0 && top > k) top -= b;
            }
            image.style.width = rect.width + zoom + "px";
            tts.left = left + "px"; tts.top = top + "px";
        }
        gBrowser.addEventListener('DOMMouseScroll', imageZoom, true);

        // удалить подсказку и обработчики ....
        function removeTooltip() {
            try { gBrowser.removeChild( tooltip ) } catch(e) {};
            gBrowser.removeEventListener("click", removeTooltip, true);
            gBrowser.removeEventListener("DOMMouseScroll", imageZoom, true);
        }
        gBrowser.addEventListener("click", removeTooltip, true);  // удалить по клику на странице
    }   
})();

Отсутствует

 

№5502-01-2014 23:21:16

voqabuhe
Участник
 
Группа: Members
Зарегистрирован: 06-12-2011
Сообщений: 3231
UA: Firefox 29.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1
Ну на мой взгляд теперь совсем другое дело, увеличение просто безупречное. Огромное спасибо тебе и Dumby.  И с Новым Годом Вас. :beer:

Отредактировано voqabuhe (02-01-2014 23:44:12)

Отсутствует

 

№5608-03-2014 16:16:45

bezuma
Участник
 
Группа: Members
Откуда: Москва
Зарегистрирован: 26-01-2014
Сообщений: 256
UA: Firefox 27.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1
С последним изменением от Dumby - превосходно, спасибо вам!

Отсутствует

 

№5715-03-2014 10:35:21

voqabuhe
Участник
 
Группа: Members
Зарегистрирован: 06-12-2011
Сообщений: 3231
UA: Firefox 30.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1 пишет

Версия: от 14.03.2014

В [nightly] не работает. С версией от 02.01.2014 всё ОК.

Отсутствует

 

№5815-03-2014 13:09:43

bunda1
Moderator
 
Группа: Moderators
Откуда: Латвия
Зарегистрирован: 09-02-2010
Сообщений: 4811
UA: Firefox 3.6

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

voqabuhe пишет
bunda1 пишет

Версия: от 14.03.2014

В [nightly] не работает. С версией от 02.01.2014 всё ОК.

Теперь попробуй Увеличивать размеры изображений из контекстного меню на странице

Отсутствует

 

№5915-03-2014 14:01:50

voqabuhe
Участник
 
Группа: Members
Зарегистрирован: 06-12-2011
Сообщений: 3231
UA: Firefox 30.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1
Теперь всё как надо. Спасибо.

Отсутствует

 

№6020-04-2014 22:52:08

difabor
Участник
 
Группа: Members
Зарегистрирован: 21-09-2013
Сообщений: 539
UA: Firefox 28.0
Веб-сайт

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1 пишет

voqabuhe пишет: bunda1 пишет: Версия: от 14.03.2014В  не работает. С версией от 02.01.2014 всё ОК.Теперь попробуй Увеличивать размеры изображений из контекстного меню на странице

А можно ли увеличивать размеры не по контекстному меню, а по длинному клику на картинку? Или просто по ховерингу?


Хорошо, когда у человека есть выбор, но плохо, когда он перед ним стоит ©

Отсутствует

 

№6129-05-2015 12:01:40

emlen
Участник
 
Группа: Members
Зарегистрирован: 22-05-2015
Сообщений: 201
UA: Seamonkey 2.33

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

Еще бы была возможность перемещать увеличенную картинку  - цены бы ему не было)


SeaMonkey 2.39 forever

Отсутствует

 

№6229-05-2015 14:28:02

bunda1
Moderator
 
Группа: Moderators
Откуда: Латвия
Зарегистрирован: 09-02-2010
Сообщений: 4811
UA: Firefox 24.0

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

emlen пишет

Еще бы была возможность перемещать увеличенную картинку  - цены бы ему не было)

Зачем?

Отсутствует

 

№6329-05-2015 14:33:19

emlen
Участник
 
Группа: Members
Зарегистрирован: 22-05-2015
Сообщений: 201
UA: Seamonkey 2.33

Re: [CB]Увеличивать размеры изображений из контекстного меню на странице

bunda1, иногда необхдимо рассмотреть определенную деталь на изображении, его увеличиваешь, а потом двигаешь, фокусируясь на искомом объекте.. Другой сценарий: изображение увеличили, и оно еще нужно, но оно закрыло что-то также нужное в екущий ммент на страничке...


SeaMonkey 2.39 forever

Отсутствует

 
  • Форумы
  •  » Сustom Buttons
  •  » [CB]Увеличивать размеры изображений из контекстного меню на странице

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]