JQuery, изменяющий размеры изображения

Хотя совершенно возможно использовать рекурсивный regex, поскольку MizardX отправил, для такого рода вещей это намного более полезно синтаксический анализатор. Regexes были первоначально предназначены, чтобы использоваться с регулярными языками, быть рекурсивными или имеющими группами балансировки является просто патчем.

язык, который определяет допустимый regexes, является на самом деле контекстно-свободной грамматикой, и необходимо использовать соответствующий синтаксический анализатор для обработки его. Вот пример для университетского проекта для парсинга простого regexes (без большинства конструкций). Это использует JavaCC. И да, комментарии находятся на испанском языке, хотя имена методов довольно очевидны.

SKIP :
{
    " "
|   "\r"
|   "\t"
|   "\n"
}
TOKEN : 
{
    < DIGITO: ["0" - "9"] >
|   < MAYUSCULA: ["A" - "Z"] >
|   < MINUSCULA: ["a" - "z"] >
|   < LAMBDA: "LAMBDA" >
|   < VACIO: "VACIO" >
}

IRegularExpression Expression() :
{
    IRegularExpression r; 
}
{
    r=Alternation() { return r; }
}

// Matchea disyunciones: ER | ER
IRegularExpression Alternation() :
{
    IRegularExpression r1 = null, r2 = null; 
}
{
    r1=Concatenation() ( "|" r2=Alternation() )?
    { 
        if (r2 == null) {
            return r1;
        } else {
            return createAlternation(r1,r2);
        } 
    }
}

// Matchea concatenaciones: ER.ER
IRegularExpression Concatenation() :
{
    IRegularExpression r1 = null, r2 = null; 
}
{
    r1=Repetition() ( "." r2=Repetition() { r1 = createConcatenation(r1,r2); } )*
    { return r1; }
}

// Matchea repeticiones: ER*
IRegularExpression Repetition() :
{
    IRegularExpression r; 
}
{
    r=Atom() ( "*" { r = createRepetition(r); } )*
    { return r; }
}

// Matchea regex atomicas: (ER), Terminal, Vacio, Lambda
IRegularExpression Atom() :
{
    String t;
    IRegularExpression r;
}
{
    ( "(" r=Expression() ")" {return r;}) 
    | t=Terminal() { return createTerminal(t); }
    | <LAMBDA> { return createLambda(); }
    | <VACIO> { return createEmpty(); }
}

// Matchea un terminal (digito o minuscula) y devuelve su valor
String Terminal() :
{
    Token t;
}
{
    ( t=<DIGITO> | t=<MINUSCULA> ) { return t.image; }
}
41
задан tvanfosson 17 July 2009 в 14:09
поделиться

3 ответа

Пара предложений:

  • Сделайте эту функцию, в которой вы можете передавать максимальный или минимальный размер, а не жестко его кодировать; это сделает его более пригодным для повторного использования
  • . Если вы используете метод jQuery .animate , например .animate ({width: maxWidth}) , он должен автоматически масштабировать другое измерение.
10
ответ дан 27 November 2019 в 00:48
поделиться

Взгляните на Jcrop. Я использую его, и он очень хорош.

http://deepliquid.com/content/Jcrop.html

5
ответ дан 27 November 2019 в 00:48
поделиться

Отличное начало. Вот что я придумал:

$('img.resize').each(function(){
    $(this).load(function(){
        var maxWidth = $(this).width(); // Max width for the image
        var maxHeight = $(this).height();   // Max height for the image
        $(this).css("width", "auto").css("height", "auto"); // Remove existing CSS
        $(this).removeAttr("width").removeAttr("height"); // Remove HTML attributes
        var width = $(this).width();    // Current image width
        var height = $(this).height();  // Current image height

        if(width > height) {
            // Check if the current width is larger than the max
            if(width > maxWidth){
                var ratio = maxWidth / width;   // get ratio for scaling image
                $(this).css("width", maxWidth); // Set new width
                $(this).css("height", height * ratio);  // Scale height based on ratio
                height = height * ratio;    // Reset height to match scaled image
            }
        } else {
            // Check if current height is larger than max
            if(height > maxHeight){
                var ratio = maxHeight / height; // get ratio for scaling image
                $(this).css("height", maxHeight);   // Set new height
                $(this).css("width", width * ratio);    // Scale width based on ratio
                width = width * ratio;  // Reset width to match scaled image
            }
        }
    });
});

Это дает возможность указать ширину и высоту, позволяя при этом пропорционально масштабировать изображение.

6
ответ дан 27 November 2019 в 00:48
поделиться
Другие вопросы по тегам:

Похожие вопросы: