Вопросы Теги

Жидкие скругленные углы с jQuery

Привет, я попытаюсь объяснить, что происходит в этом фрагменте кода 

public class Test { 
  public static void main(String[] args) {
    int list[] = {1, 2, 3, 4, 5, 6};

Эта строка эквивалентна следующему коду 

    int list[] = new int[6];
    list[0] = 1;
    list[1] = 2;
    list[2] = 3;
    list[3] = 4;
    list[4] = 5;
    list[5] = 6;


    for (int i = 1; i < list.length; i++)
      list[i] = list[i - 1];

, этот цикл является эквивалентным следующего кода 

    list[1] = list[0];
    list[2] = list[1];
    list[3] = list[2];
    list[4] = list[3];
    list[5] = list[4];

, который, поскольку list[0] = 1 является эквивалентом следующего 

    list[1] = 1;
    list[2] = 1;
    list[3] = 1;
    list[4] = 1;
    list[5] = 1;


    for (int i = 0; i < list.length; i++)
      System.out.print(list[i] + " ");
  }
}

, именно поэтому вы получаете вывод, который вы получаете

15
задан Tushar Gupta - curioustushar 30 July 2013 в 16:40
поделиться

4 ответа

Я использую: Jquery-roundcorners-canvas

это обрабатывает границы и сохраняет вещи тем же размером, на самом деле необходимо дополнить в немного для удержаний от наличия букв, живых в складке. Его довольно быстрое, если Вы не идете т.е. 6. Тот же симпатичный синтаксис других угловых пакетов, но просто более симпатичный в целом.

Отредактированный для добавления новой ссылки для jQuery Холст Roundcorners

9
ответ дан 1 December 2019 в 02:38
поделиться

Путем UI jQuery Theming, API выполняет это в Firefox, с "Угловыми Помощниками Радиуса".

Вот то, на что они похожи в CSS, который был связан в моей копии UI:

/* Corner radius */
.ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; }
.ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
.ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
.ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-top { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
.ui-corner-bottom { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-right {  -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-left { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
.ui-corner-all { -moz-border-radius: 4px; -webkit-border-radius: 4px; }

К сожалению, они, кажется, не имеют эффекта в IE7 с этого сообщения.

В коде jQuery один из этих классов мог бы быть применен способом что-то вроде этого:

$('#SomeElementID').addClass("ui-corner-all");
7
ответ дан 1 December 2019 в 02:38
поделиться

Если вы хотите полностью контролировать границу и градиент, вы можете использовать мой плагин iQuery Background Canvas. Он работает с элементом HTML5 Canvas и позволяет рисовать границы и фон в любых вариациях. Но вы должны уметь программировать JavaScript

. Это полнофункциональный образец с градиентом фона и закругленными углами. Как видите, рисунок полностью выполнен на JavaScript, вы можете установить любой параметр, который хотите. Рисунок переделывается при каждом изменении размера (из-за события изменения размера), вы можете адаптировать фоновый рисунок, чтобы показать, что вы хотите на этом конкретном размере. 

$(document).ready(function(){
    $(".Test").backgroundCanvas();
});

function DrawBackground() {
    $(".Test").backgroundCanvasPaint(TestBackgroundPaintFkt);
}
// Draw the background on load and resize
$(window).load(function () { DrawBackground(); });
$(window).resize(function() { DrawBackground(); });

function TestBackgroundPaintFkt(context, width, height, elementInfo){
    var options = {x:0, height: height, width: width, radius:14, border: 0 };
    // Draw the red border rectangle
    context.fillStyle = "#FF0000";
    $.canvasPaint.roundedRect(context,options);
    // Draw the gradient filled inner rectangle
    var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 10);
    backgroundGradient.addColorStop(0 ,'#AAAAFF');
    backgroundGradient.addColorStop(1, '#AAFFAA');
    options.border = 5;
    context.fillStyle = backgroundGradient;
    $.canvasPaint.roundedRect(context,options);
}

Вот плагин, и этот сайт широко его использует: Подключаемый модуль jQuery Background Canvas

0
ответ дан 1 December 2019 в 02:38
поделиться
Другие вопросы по тегам:

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