jquery вопрос

[Alecto]

например, есть

скрипт1.js
где есть вызов
$(document).ready(function() { своя обработка }

и

скрипт2.js
где так же есть вызов
$(document).ready(function() { другая обработка }


вызов
$(document).ready(function()
из разных скриптов допускаются?

[Татьяна5]

Да

[Alecto]

вот что у меня не получилось...

имеем ббкод IMW с "Замена HTML":

Код: Выделить всё

<img class="resize-image" src="{URL}" alt="" />

далее пробовал отработать скриптом

Код: Выделить всё

(function ($) {  // Avoid conflicts with other libraries


$(document).ready(function() {
$('.resize-image').each(function() {
var maxWidth = 650; // Max width for the image
var maxHeight = 500; // Max height for the image
var ratio = 0; // Used for aspect ratio
var width = $(this).width(); // Current image width
var height = $(this).height(); // Current image height
 


if(width < maxWidth){
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
width = width * ratio; // Reset width to match scaled image
} else { // Check if the current width is larger than the max if(width > maxWidth){
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
width = width * ratio; // Reset width to match scaled image
}
 
// Check if current height is larger than max
if(height > maxHeight){
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
}

});
});




})(jQuery);                                                               // Avoid conflicts with other libraries

1 - иногда успеваю заметить, как изображения машстабируются.
2 - функция выставляет класс одинаково то ли для всех изображений, то ли по видимому - так и не понял.

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

[ostridm]

дкло в том что document.ready вызывается до загрузки картинок - так работать не будет

[Alecto]

Может и не будет, но работает. Только работает не индивидульно с картинкой, а с классом.

[ostridm]

получиль в итоге нестабильное решение только и всего

[Alecto]

как раз и прошу помочь довести до ума решение.

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

Код: Выделить всё

<div class="resize-image" >
<img src="{URL}" alt="" onload="$(this).ImageResize()" />
</div>

единственное что не устраивает - успеваю заметить немасштибированные изображения.

вижу 2 варианта решения:
1 - добавить классу невидимость, затем функцией делать изображения видимыми после обработки
если идти этим путем, если с событием onload я не прогадал, можно сделать очень красивое проявление изображений.
2 - может быть существует более подходящее событие, чем onload ?

+ еще конфликтует с новым спойлером на jquery, но сначала надо разобраться с выводом изображений

[ostridm]

см сюдой
https://www.phpbb.com/community/viewtop ... &t=2236221

и сюдой

Код: Выделить всё

$(function() {
var resizeWidth = {LIGHTBOX_RESIZE_WIDTH},
targetImage = $('.postimage'),
galleryName = 'post-gallery',
imagesIndex = 0;
if (resizeWidth > 0 && $(window).width() > 900) {
targetImage.css('max-width', resizeWidth + 'px');
} else {
return;
}
targetImage.one('load', function() {
if ($(this).closest('.postlink').length > 0) return;
imagesIndex = ({$LIGHTBOX_GALLERY}) ? '' : imagesIndex + 1;
if ($(this).parent('a').length > 0) {
$(this).parent('a').attr({
'data-lightbox': galleryName + imagesIndex,
'data-title': $(this).attr('alt')
}).end().borderHover();
}
else if ($(this).width() >= resizeWidth) {
$(this).wrap(function() {
var url = $(this).attr('src'),
title = (url.indexOf('download/file.php') !== -1) ? $(this).attr('alt') : url.split('/').pop();
return '<a href="' + url + '" data-lightbox="' + galleryName + imagesIndex + '" data-title="' + title + '"></a>';
}).borderHover();
}
}).each(function() {
if (this.complete) $(this).load();
});
});

[Alecto]

спасибо.
судя по описанию - это то, что нужно, поставил, вот только оно не работает. в админке расширение не появилось.

[Alecto]

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

highslide прекрасно справляется в 3.0.12, вот только там другие библиотеки помоему, долго и нудно решал конфликту motools и jquery, не хотелось бы их тащить в 3.1.
да и был один досадный недостаток:
задача у меня такая... всем картинкам любого размера принудительно через ЦСС выставить ширину 650пкс - здесь все ок.
но вот отмасштабировать изображения в ЦСС еще и по высоте, если она превышает определенный размер (после подгонки по ширине), да еще и с сохранением пропорций - не получается.
остается довольствоваться только масштабом по одной стороне... вот поэтому и завелся со скриптом.
ну а по клику на изображении, он замечательно открывались вьювером highslide.