Выбор JQuery Jcrop

не знаю, что произошло в моем выборе jcrop. Кажется, я нажал какие-то клавиши на клавиатуре, которые превратили ручки выделения из квадратов в точки. В качестве браузера использую mozilla firefox.

введите здесь описание изображения

Исходный дескриптор должен быть квадратным, как показано ниже.

введите здесь описание изображения


person Jed    schedule 25.06.2012    source источник


Ответы (1)


Квадраты являются частью css. CSS по умолчанию, который поставляется с ним, выглядит так:

.jcrop-holder{direction:ltr;text-align:left}
.jcrop-vline,.jcrop-hline{background:#FFF url(Jcrop.gif) top left repeat;font-size:0;position:absolute}
.jcrop-vline{height:100%;width:1px!important}
.jcrop-hline{height:1px!important;width:100%}
.jcrop-vline.right{right:0}
.jcrop-hline.bottom{bottom:0}
.jcrop-handle{background-color:#333;border:1px #eee solid;font-size:1px}
.jcrop-tracker{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;height:100%;width:100%}
.jcrop-handle.ord-n{left:50%;margin-left:-4px;margin-top:-4px;top:0}
.jcrop-handle.ord-s{bottom:0;left:50%;margin-bottom:-4px;margin-left:-4px}
.jcrop-handle.ord-e{margin-right:-4px;margin-top:-4px;right:0;top:50%}
.jcrop-handle.ord-w{left:0;margin-left:-4px;margin-top:-4px;top:50%}
.jcrop-handle.ord-nw{left:0;margin-left:-4px;margin-top:-4px;top:0}
.jcrop-handle.ord-ne{margin-right:-4px;margin-top:-4px;right:0;top:0}
.jcrop-handle.ord-se{bottom:0;margin-bottom:-4px;margin-right:-4px;right:0}
.jcrop-handle.ord-sw{bottom:0;left:0;margin-bottom:-4px;margin-left:-4px}
.jcrop-dragbar.ord-n,.jcrop-dragbar.ord-s{height:7px;width:100%}
.jcrop-dragbar.ord-e,.jcrop-dragbar.ord-w{height:100%;width:7px}
.jcrop-dragbar.ord-n{margin-top:-4px}
.jcrop-dragbar.ord-s{bottom:0;margin-bottom:-4px}
.jcrop-dragbar.ord-e{margin-right:-4px;right:0}
.jcrop-dragbar.ord-w{margin-left:-4px}
.jcrop-light .jcrop-vline,.jcrop-light .jcrop-hline{background:#FFF;filter:Alpha(opacity=70)!important;opacity:.70!important}
.jcrop-light .jcrop-handle{-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#000;border-color:#FFF;border-radius:3px}
.jcrop-dark .jcrop-vline,.jcrop-dark .jcrop-hline{background:#000;filter:Alpha(opacity=70)!important;opacity:.7!important}
.jcrop-dark .jcrop-handle{-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#FFF;border-color:#000;border-radius:3px}
.jcrop-holder img,img.jcrop-preview{max-width:none}

Вам также понадобится файл Jcrop.gif, который также является частью загрузки Jcrop — для приведенного выше css он должен находиться в той же папке, что и css. Так что я подозреваю, что либо gif, либо css теперь выходят за рамки

person Graham    schedule 25.06.2012
comment
Спасибо за немедленный ответ на мой вопрос. Но у меня уже был Jcrop.gif в папке, где находится мой файл css для jcrop. - person Jed; 25.06.2012
comment
Я уже проверил в firebug файл jcrop.gif на панели css, но изображение успешно загружено. Я не думаю, что проблема в .gif. - person Jed; 25.06.2012
comment
Я уже решил проблему. Именно в той версии, которую я скачал в инете. Кажется, что css, который я скачал в Интернете, является последним, а то, что я читаю из Jquery: Novice to Ninja 2nd Edition, старше. Хе-хе. большое спасибо. Вы заслуживаете принятого ответа. :-D - person Jed; 25.06.2012
comment
Добавьте этот css в свой файл jcrop.css. Это решило проблему для меня. Благодарю. :D - person ; 01.04.2014