Слайд-шоу в Универсальном каталоге

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО

Реализация слайд-шоу в Универсальном каталоге

#31 28 мая 2012 в 20:55
вообще то смысл всех таких лайтбоксов в том что бы вписать картинку в окно .....

т.е. если картинка превышает размер монитора (или области окна браузера) то она вписывается в окно
если равна или меньше, то выводится как есть

картинка одна и та же



но тут изменил размер окна

#32 30 мая 2012 в 22:40


вообще то смысл всех таких лайтбоксов в том что бы вписать картинку в окно .....

т.е. если картинка превышает размер монитора (или области окна браузера) то она вписывается в окно
если равна или меньше, то выводится как есть

картинка одна и та же



но тут изменил размер окна


mexanik
Я так понял вы намекаете на то что нельзя поменять размер?
#33 30 мая 2012 в 22:57
Всё таки я не допёр где можно редактировать размер фото которое открывается в слайде, и поэтому перезалил файлы с старого сайта вроде размер поменялся но не настолько насколько надо (

Видел на одном сайте при просмотре слайда в правом верхнем угле есть ссылочка или кнопочка для увеличения фото, в лайт боксе такая есть?
#34 30 мая 2012 в 23:27
не, кнопочек не видел

а размер, размер изменяется автоматически js скриптом
#35 31 мая 2012 в 00:34


не, кнопочек не видел

а размер, размер изменяется автоматически js скриптом

mexanik

Получается вы утверждаете что размер поменять нельзя?
#36 31 мая 2012 в 01:46
чухае потилицю
не

давай так

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

а то, наверно моя твоя непонима
#37 31 мая 2012 в 12:43


чухае потилицю
не

давай так

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

а то, наверно моя твоя непонима

mexanik

Вот скрин, думаю сейчас понятнее будет) требуется увеличение фото которое окрывается по клику.

Вот Здесь открывается по стандарту, как вы и говорили фото формируется автоматом
А вот Здесь настроен нужный размер, конечно оч коряво да таких больших размеров не нужно. Здесь я сам подстрою как надо, вернее как нужно владельцам. Вот тока где эти размеры задавать я так и не нашёл
Прикрепленный файл
primer_e2krc.png 287 Кб
#38 31 мая 2012 в 13:09

А вот Здесь настроен нужный размер, конечно оч коряво да таких больших размеров не нужно

Откуда такая информация, что он там настроен? Насколько я вижу там рисунки действительно большого размера.
#39 31 мая 2012 в 13:14


А вот Здесь настроен нужный размер, конечно оч коряво да таких больших размеров не нужно

Откуда такая информация, что он там настроен? Насколько я вижу там рисунки действительно большого размера.

Pasha

Ну я так полагаю потому что делал это человек, и каким образом он это сделал я найти не могу весь код уже пересмотрел но наводки не нашёл (( Рисунки в оригинале одинаковые что на основном домене что на поддомене.
#40 31 мая 2012 в 13:44
traffs, отключите выполнение javascript в браузере, чтоб он вам не мешал и просто откройте тот рисунок, который "делал человек". Какие он имеет размеры?
#41 31 мая 2012 в 14:52


traffs, отключите выполнение javascript в браузере, чтоб он вам не мешал и просто откройте тот рисунок, который "делал человек". Какие он имеет размеры?

Pasha
1 рисунок без увелечения
width: 455px;
height: 607px;

2 рисунок с увеличение который какраз слайд и показывает
width: 845px;
height: 1126px;

Он делал не один рисунок ) он просто напросто где-то задал размеры и теперь эти окна открываются по заданному размеру
#42 31 мая 2012 в 15:28
traffs, да не задавал никто и нигде никаких размеров. Просто в случае номер 1 ссылка (маленький рисунок) по которой открывается окно ведет на тот же самый маленький рисунок, а во втором случае эта ссылка указывает на большой рисунок.
#43 31 мая 2012 в 15:58


traffs, да не задавал никто и нигде никаких размеров. Просто в случае номер 1 ссылка (маленький рисунок) по которой открывается окно ведет на тот же самый маленький рисунок, а во втором случае эта ссылка указывает на большой рисунок.

Pasha

Получается Картинка с поддомена в слайде открывается в авто размере под браузер, а картинка с домена открывается в оригинале, ну дак как заставить открывать оригинал на поддомене не пойму.Лайтбокс на поддомене по сути открывает оригинал но обрезает его до нужных размеров в зависимости от браузера и разрешения. Возможно надо просто отключить автоформирование рисунка под браузер?
#44 31 мая 2012 в 16:01
в файле jquery.lightbox.js

строки

с 953 по 1060 отвечают за получение размера монитора если браузер открыт на полную
или размера окна браузера если не на полную

и исходя из этих размеров производится вычисления для того что бы вписать изображение в окно, если размеры изображения превышают размер окна или вывести изображение полностью если оно меньше чем окно

  1. resizeBoxes: function ( type )
  2. { // Resize the boxes
  3. // Used on transition or window resize
  4.  
  5. // Resize Overlay
  6. if ( type !== 'transition' )
  7. { // We don't care for transition
  8. var $body = $(this.ie6 ? document.body : document);
  9. $('#lightbox-overlay').css({
  10. width: $body.width(),
  11. height: $body.height()
  12. });
  13. delete $body;
  14. }
  15.  
  16. // We no longer care if we are general
  17. if ( type === 'general' )
  18. { // Done
  19. return true;
  20. }
  21.  
  22. // Get image
  23. var image = this.images.active();
  24. if ( !image || !image.width || !this.visible )
  25. { // No image or no visible lightbox, so we don't care
  26. $.log('WARNING', 'A resize occured while no image or no lightbox...');
  27. return false;
  28. }
  29.  
  30. // Resize image box
  31. // i:image, w:window, b:box, c:current, n:new, d:difference
  32.  
  33. // Get image dimensions
  34. var iWidth = image.width;
  35. var iHeight = image.height;
  36.  
  37. // Get window dimensions
  38. var wWidth = $(window).width();
  39. var wHeight = $(window).height();
  40.  
  41. // Check if we are in size
  42. // Lightbox can take up 4/5 of size
  43. var maxWidth = Math.floor(wWidth*(4/5));
  44. var maxHeight = Math.floor(wHeight*(4/5));
  45. var resizeRatio;
  46. while ( iWidth > maxWidth || iHeight > maxHeight )
  47. { // We need to resize
  48. if ( iWidth > maxWidth )
  49. { // Resize width, then height proportionally
  50. resizeRatio = maxWidth/iWidth;
  51. iWidth = maxWidth;
  52. iHeight = Math.floor(iHeight*resizeRatio);
  53. }
  54. if ( iHeight > maxHeight )
  55. { // Resize height, then width proportionally
  56. resizeRatio = maxHeight/iHeight;
  57. iHeight = maxHeight;
  58. iWidth = Math.floor(iWidth*resizeRatio);
  59. }
  60. }
  61.  
  62. // Get current width and height
  63. var cWidth = $('#lightbox-imageBox').width();
  64. var cHeight = $('#lightbox-imageBox').height();
  65.  
  66. // Get the width and height of the selected image plus the padding
  67. // padding*2 for both sides (left+right || top+bottom)
  68. var nWidth = (iWidth + (this.padding * 2));
  69. var nHeight = (iHeight + (this.padding * 2));
  70.  
  71. // Diferences
  72. var dWidth = cWidth - nWidth;
  73. var dHeight = cHeight - nHeight;
  74.  
  75. // Set the overlay buttons height and the infobox width
  76. // Other dimensions specified by CSS
  77. $('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css('height', nHeight);
  78. $('#lightbox-infoBox').css('width', nWidth);
  79.  
  80. // Handle final action
  81. if ( type === 'transition' )
  82. { // We are transition
  83. // Do we need to wait? (just a nice effect to counter the other
  84. if ( dWidth === 0 && dHeight === 0 )
  85. { // We are the same size
  86. this.pause(this.speed/3);
  87. this.showImage(null, 3);
  88. }
  89. else
  90. { // We are not the same size
  91. // Animate
  92. $('#lightbox-image').width(iWidth).height(iHeight);
  93. $('#lightbox-imageBox').animate({width: nWidth, height: nHeight}, this.speed, function ( ) { $.Lightbox.showImage(null, 3); } );
  94. this.repositionBoxes({'nHeight':nHeight, 'speed':this.speed});
  95. }
  96. }
  97. else
  98. { // We are a resize
  99. // Animate Lightbox
  100. $('#lightbox-image').animate({width:iWidth, height:iHeight}, this.speed);
  101. $('#lightbox-imageBox').animate({width: nWidth, height: nHeight}, this.speed);
  102. this.repositionBoxes({'nHeight':nHeight, 'speed':this.speed});
  103. }
  104.  
  105. // Done
  106. return true;
  107. },
можно пропробовать для переменных var задать значения типа max-width max-height

но одним местом чувствую что ничего хорошего из этого не выйдет…
#45 31 мая 2012 в 16:06
просмотрел каталог new.statmen.ru/catalog/1024 через лайтбокс

например почти все изображения имеют одинаковый размер а вот cg3843k или t8402s размер больше
потому и меняет лайтбокс свои размеры подстраиваясь под него

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