Чем могут быть вызваны ошибки в jquery.prettyPhoto.js?

Question

Александра Маслова @Alexandr94

JavaScript

Чем могут быть вызваны ошибки в jquery.prettyPhoto.js?

Доброго времени суток!

После установки SSl сертификата перестал корректно работать jquery.prettyPhoto.js, а именно, в консоли всплывает 3 ошибки

jquery.prettyPhoto.js:553 Uncaught TypeError: Cannot read property 'height' of undefined
    at _centerOverlay (jquery.prettyPhoto.js:553)
    at init.$.fn.prettyPhoto (jquery.prettyPhoto.js:643)
    at callback_changeShop ((index):232)
    at JsHttpRequest.req.onreadystatechange (JsHttpRequest.js:284)
    at JsHttpRequest.t._changeReadyState (JsHttpRequest.js:239)
    at JsHttpRequest.t._dataReady (JsHttpRequest.js:137)
    at Function.JsHttpRequest.dataReady (JsHttpRequest.js:301)
    at Function.JsHttpRequest._tmp (eval at xr.onreadystatechange (JsHttpRequest.js:388), <anonymous>:1:5092)
    at XMLHttpRequest.xr.onreadystatechange (JsHttpRequest.js:393)
jquery.prettyPhoto.js:553 Uncaught TypeError: Cannot read property 'height' of undefined
    at _centerOverlay (jquery.prettyPhoto.js:553)
    at jquery.prettyPhoto.js:101
    at handle (jquery.js:1936)
    at eventHandle (jquery.js:1599)

подскажите решение данной проблемы, заранее спасибо!

Вопрос задан более трёх лет назад
109 просмотров

6 комментариев

Подписаться 1 Простой 6 комментариев

Айнур Валиев @vaajnur

видимо у тебя динамический контент с аякс подгрузкой. покажи код вызова

Написано более трёх лет назад

Александра Маслова @Alexandr94 Автор вопроса

Айнур Валиев,

<script language="JavaScript" src='js/JsHttpRequest.js'></script>


<script language="javascript">

/* после 1 мая 2013 показываем другой магаз по умолчанию в Москве*/
var map_load = 0;
<? if(time() < strtotime('1 May 2013 00:00:00')):?>
var mos_shop_dafault = 2;
<? else:?>
var mos_shop_dafault = 118;
<? endif;?>

function in_array(needle, haystack, strict) {	// Checks if a value exists in an array
  // 
  // +   original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)

  var found = false, key, strict = !!strict;

  for (key in haystack) {
    if ((strict && haystack[key] === needle) || (!strict && haystack[key] == needle)) {
      found = true;
      break;
    }
  }

  return found;
}


function changeGorod(g_id)
{
  JsHttpRequest.query(
    '<?php echo config_item('base_url'); ?>buy/get_text_by_gorod/' + g_id,
    {},
    callback_changeGorod,
    true
  );
  if(g_id == 2) changeShop(mos_shop_dafault);
  
  
  if(in_array(g_id, [58, 11, 15, 19, 20, 21, 23, 28, 32, 33, 35, 37, 39, 43, 45, 51, 65, 67, 71, 74, 77])) changeShop(g_id);
  
  //if(g_id == 14) changeShop(14);
  return;
}

function changeShop(s_id)
{
  JsHttpRequest.query(
    '<?php echo config_item('base_url'); ?>buy/get_text_by_shop/' + s_id,
    {},
    callback_changeShop,
    true
  );
}

var callback_changeGorod = function(js) {
  document.getElementById('buy_block1').innerHTML = js.text1;
  document.getElementById('buy_block2').innerHTML = js.text2;
}

var callback_changeShop = function(js) {
  document.getElementById('buy_block2').innerHTML = js.text;
  $("#link_img_shop_" + js.id).prettyPhoto({theme:'facebook'});
}

function load()
{
  if(($("#buy_block2 iframe").length === false) || ($("#buy_block2 iframe").length < 1)) 
  {
    changeGorod($("#gorod").val());
    if($("#gorod").val() == 2) changeShop(mos_shop_dafault);
    setTimeout('load()', 1000);
  }
}
//1367352000
$(document).ready(function(){
  setTimeout('load()', 100);
});


</script>
      <div class="main"><div class="main_foot">
            	<div class="pad2">
                    <h1>Где купить</h1>
                    <div class="gorod">
                        <p>Город:</p>
                        <p><select onchange="changeGorod(this.value)" id="gorod">
              <option value='0'>Выберите город</option>
              <?php
              foreach($goroda as  $g)
              {
                echo "<option value='".$g['id']."' ".($g['id'] == 2 ? "selected" : '').">".$g['name']."</option>";
              }
              ?>
            </select></p>
                    </div>

          <div id='buy_block1'></div>

                </div>

        <br clear='all'><br><br>
                
                <div class="info3"><div class="info3_foot">
                    <div id='buy_block2'></div>
          <div class="clear"></div>
                </div></div>
                
                <div class="tumbs2">
                	<div class="tumb3">
                    	<p class="title2"><?php echo $page1['name']; ?></p>
                        <p><?php echo nl2br($page1['text']); ?></p>
                    </div>
                    <div class="tumb3">
                    	<p class="title2"><?php echo $page2['name']; ?></p>
                        <p><?php echo nl2br($page2['text']); ?></p>
                    </div>
                    <div class="clear"></div>
                </div>
                
        </div></div>

Написано более трёх лет назад

Александра Маслова @Alexandr94 Автор вопроса

Айнур Валиев,

<script language="javascript">

var goroda = [];
var shops = [];

<?php 
  foreach($goroda as $g)
  {
    echo "goroda.push('".$g['id']."');\n";
    foreach($shops[$g['id']] as $s)
    {
      echo "shops.push(".$s['id'].");\n";
    }
  }
?>

function changeGorod(g_id)
{
  for(var i = 0; i < shops.length; i++)
  {
    document.getElementById('map' + shops[i]).style.display = 'none';
    document.getElementById('opis' + shops[i]).style.display = 'none';
    document.getElementById('shop_block_' + shops[i]).className = 'block4';
  }
  for(var i = 0; i < goroda.length; i++)
  {
    document.getElementById('shops' + goroda[i]).style.display = 'none';
    document.getElementById('gorod' + goroda[i]).style.display = 'none';
  }
  if(g_id)
  {
    if(document.getElementById('shops' + g_id)) document.getElementById('shops' + g_id).style.display = 'block';
    if(document.getElementById('gorod' + g_id)) document.getElementById('gorod' + g_id).style.display = 'block';
  }
}

function changeShop(s_id)
{
  for(var i = 0; i < shops.length; i++)
  {
    document.getElementById('map' + shops[i]).style.display = 'none';
    document.getElementById('opis' + shops[i]).style.display = 'none';
    document.getElementById('shop_block_' + shops[i]).className = 'block4';
  }
  for(var i = 0; i < goroda.length; i++)
  {
    document.getElementById('gorod' + goroda[i]).style.display = 'none';
  }
  if(s_id)
  {
    document.getElementById('map' + s_id).style.display = 'block';
    document.getElementById('opis' + s_id).style.display = 'block';
    document.getElementById('shop_block_' + s_id).className = 'block4_active';
  }
}

</script>
      <div class="main"><div class="main_foot">
            	<div class="pad2">
                    <h1>Где купить</h1>
                    <div class="gorod">
                        <p>Город:</p>
                        <p><select onchange="changeGorod(this.value)">
              <option value='0'>Выберите город</option>
              <?php
              foreach($goroda as  $g)
              {
                echo "<option value='".$g['id']."'>".$g['name']."</option>";
              }
              ?>
            </select></p>
                    </div>

          <?php foreach($shops as $g_id => $arr) {?>
                    
          <div class="blocks" id='shops<?php echo $g_id; ?>' style="display:none;">
            <?php foreach($arr as $s) { ?>
                    	<div class="block4" id='shop_block_<?php echo $s['id']; ?>'><div class="block4_l"><div class="block4_r">
                        	<a class="strela" href="javascript:void(0);" title="" onclick="changeShop(<?php echo $s['id']; ?>)"><img src="images/strela.gif" alt="" /></a>
                        	<p><a href="javascript:void(0);" title="" onclick="changeShop(<?php echo $s['id']; ?>)"><?php echo $s['address'];?></a></p>
                            <p><?php echo $s['metro'];?></p>
                            <p><?php echo $s['phone'];?></p>
                        </div></div></div>
            <?php } ?>
                        <div class="clear"></div>
                    </div>
          
          <?php } ?>

                </div>
                
                <div class="info3"><div class="info3_foot">
          <?php 
          foreach($goroda as $g) {
          ?>

                	<div class="map" id="gorod<?php echo $g['id']; ?>" style="display:none;"><?php  echo $g['map']; ?></div>

          <?php
          foreach($shops[$g['id']] as $s) {
          ?>
                	<div class="map" id="map<?php echo $s['id']; ?>" style="display:none;"><?php echo $s['map']; ?></div>
                    <div class="opis3" id='opis<?php echo $s['id']; ?>' style="display:none;">
                    	<div class="tx4">
                        	<p><?php echo $s['address']; ?></p>
              <p><?php echo $s['metro']; ?></p>
                            <p><?php echo $s['phone'];?></p>
                        </div>
            <?php if($s['img']) { ?>
              <p class="foto4"><a href='<?php echo UPLOAD_PATH.$s['img']; ?>' rel='prettyPhoto'><img src="<?php echo $s['img_small']; ?>" /></a></p>
            <?php } ?>
                        
                        <p class="tema3">Описание проезда</p>
                        <?php echo $s['proezd']; ?>
                        
                    </div>

          <?php }} ?>
                    
          <div class="clear"></div>
                </div></div>
                
               	 <div class="tumbs2">
                    <div class="tumb3">
                    	<p class="title2"><?php echo $page1['name']; ?></p>
                        <p><?php echo nl2br($page1['text']); ?></p>
                    </div>
                    <div class="tumb3">
                    	<p class="title2"><?php echo $page2['name']; ?></p>
                        <p><?php echo nl2br($page2['text']); ?></p>
                    </div>
                    <div class="clear"></div>
                </div>
                
        </div></div>

<script language="JavaScript">

$(document).ready(function(){
  $("a[rel^='prettyPhoto']").prettyPhoto({theme:'facebook'});
});

</script>

Написано более трёх лет назад

Айнур Валиев @vaajnur

Александр Маслов, да, была подобная ошибка и у меня. В аякс запросе уходит на себя, но без https, когда урл подставляешь пхп переменной. В моем случае решилось так:
1. жестко прописал https в урле запроса.
2. убрал параметры '<?php echo config_item('base_url'); ?>buy/get_text_by_shop/' + s_id, и передавал их в data.

Написано более трёх лет назад
Александра Маслова @Alexandr94 Автор вопроса

Айнур Валиев, а не могли бы вы описать по подробнее? А то все мои попытки тщетны, видимо что-то не то я делаю(

Написано более трёх лет назад
Айнур Валиев @vaajnur
Александр Маслов, там где у тебя уходит аякс запрос
JsHttpRequest.query( ...
делай console.log урла и посмтри, что там уходит (https ли)
а также убери параметры g_id s_id с урла и передавай их в data (2-й параметр), то бишь
JsHttpRequest.query( address, // the path to backend data, // the JavaScript array with data you want to pass onreadyfunc(result, errors), // the function is called when an answer is ready nocache // if set to TRUE, caching will be disabled );
Написано более трёх лет назад

Пригласить эксперта

Ответы на вопрос 1

5 комментариев

Александра Маслова @Alexandr94 Автор вопроса

Вот собственно говоря весь код jquery.prettyPhoto.js (первая часть)

/* ------------------------------------------------------------------------
	Class: prettyPhoto
	Use: Lightbox clone for jQuery
	Author: Stephane Caron (http://www.no-margin-for-errors.com)
	Version: 2.5.6
------------------------------------------------------------------------- */

(function($) {
	$.prettyPhoto = {version: '2.5.6'};
	
	$.fn.prettyPhoto = function(settings) {
		settings = jQuery.extend({
			animationSpeed: 'normal', /* fast/slow/normal */
			opacity: 0.80, /* Value between 0 and 1 */
			showTitle: true, /* true/false */
			allowresize: true, /* true/false */
			default_width: 500,
			default_height: 344,
			counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
			theme: 'light_rounded', /* light_rounded / dark_rounded / light_square / dark_square / facebook */
			hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */
			wmode: 'opaque', /* Set the flash wmode attribute */
			autoplay: true, /* Automatically start videos: True/False */
			modal: false, /* If set to true, only the close button will close the window */
			changepicturecallback: function(){}, /* Called everytime an item is shown/changed */
			callback: function(){}, /* Called when prettyPhoto is closed */
			markup: '<div class="pp_pic_holder"> \
						<div class="pp_top"> \
							<div class="pp_left"></div> \
							<div class="pp_middle"></div> \
							<div class="pp_right"></div> \
						</div> \
						<div class="pp_content_container"> \
							<div class="pp_left"> \
							<div class="pp_right"> \
								<div class="pp_content"> \
									<div class="pp_loaderIcon"></div> \
									<div class="pp_fade"> \
										<a href="#" class="pp_expand" title="Expand the image">Expand</a> \
										<div class="pp_hoverContainer"> \
											<a class="pp_next" href="#">next</a> \
											<a class="pp_previous" href="#">previous</a> \
										</div> \
										<div id="pp_full_res"></div> \
										<div class="pp_details clearfix"> \
											<a class="pp_close" href="#">Close</a> \
											<p class="pp_description"></p> \
											<div class="pp_nav"> \
												<a href="#" class="pp_arrow_previous">Previous</a> \
												<p class="currentTextHolder">0/0</p> \
												<a href="#" class="pp_arrow_next">Next</a> \
											</div> \
										</div> \
									</div> \
								</div> \
							</div> \
							</div> \
						</div> \
						<div class="pp_bottom"> \
							<div class="pp_left"></div> \
							<div class="pp_middle"></div> \
							<div class="pp_right"></div> \
						</div> \
					</div> \
					<div class="pp_overlay"></div> \
					<div class="ppt"></div>',
			image_markup: '<img id="fullResImage" src="" />',
			flash_markup: '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="{width}" height="{height}"><param name="wmode" value="{wmode}" /><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="{path}" /><embed src="{path}" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="{width}" height="{height}" wmode="{wmode}"></embed></object>',
			quicktime_markup: '<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="{height}" width="{width}"><param name="src" value="{path}"><param name="autoplay" value="{autoplay}"><param name="type" value="video/quicktime"><embed src="{path}" height="{height}" width="{width}" autoplay="{autoplay}" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"></embed></object>',
			iframe_markup: '<iframe src ="{path}" width="{width}" height="{height}" frameborder="no"></iframe>',
			inline_markup: '<div class="pp_inline clearfix">{content}</div>'
		}, settings);
		
		// Fallback to a supported theme for IE6
		if($.browser.msie && parseInt($.browser.version) == 6){
			settings.theme = "light_square";
		}
		
		if($('.pp_overlay').size()==0) _buildOverlay(); // If the overlay is not there, inject it!
		
		// Global variables accessible only by prettyPhoto
		var doresize = true, percentBased = false, correctSizes,
		
		// Cached selectors
		$pp_pic_holder, $ppt, $pp_overlay,
		
		// prettyPhoto container specific
		pp_contentHeight, pp_contentWidth, pp_containerHeight, pp_containerWidth,
		
		// Window size
		windowHeight = $(window).height(), windowWidth = $(window).width(),
	
		//Gallery specific
		setPosition = 0,

		// Global elements
		scrollPos = _getScroll();

Написано более трёх лет назад

Александра Маслова @Alexandr94 Автор вопроса

(продолжение)

// Window/Keyboard events
		$(window).scroll(function(){ scrollPos = _getScroll(); _centerOverlay(); _resizeOverlay(); });
		$(window).resize(function(){ _centerOverlay(); _resizeOverlay(); });
		$(document).keydown(function(e){
			if($pp_pic_holder.is(':visible'))
			switch(e.keyCode){
				case 37:
					$.prettyPhoto.changePage('previous');
					break;
				case 39:
					$.prettyPhoto.changePage('next');
					break;
				case 27:
					if(!settings.modal)
					$.prettyPhoto.close();
					break;
			};
	    });
	
		// Bind the code to each links
		$(this).each(function(){
			$(this).bind('click',function(){
				_self = this; // Fix scoping
				
				// Find out if the picture is part of a set
				theRel = $(this).attr('rel');
				galleryRegExp = /\[(?:.*)\]/;
				theGallery = galleryRegExp.exec(theRel);
				
				// Build the gallery array
				var images = new Array(), titles = new Array(), descriptions = new Array();
				if(theGallery){
					$('a[rel*='+theGallery+']').each(function(i){
						if($(this)[0] === $(_self)[0]) setPosition = i; // Get the position in the set
						images.push($(this).attr('href'));
						titles.push($(this).find('img').attr('alt'));
						descriptions.push($(this).attr('title'));
					});
				}else{
					images = $(this).attr('href');
					titles = ($(this).find('img').attr('alt')) ?  $(this).find('img').attr('alt') : '';
					descriptions = ($(this).attr('title')) ?  $(this).attr('title') : '';
				}

				$.prettyPhoto.open(images,titles,descriptions);
				return false;
			});
		});
	
		
		/**
		* Opens the prettyPhoto modal box.
		* @param image {String,Array} Full path to the image to be open, can also be an array containing full images paths.
		* @param title {String,Array} The title to be displayed with the picture, can also be an array containing all the titles.
		* @param description {String,Array} The description to be displayed with the picture, can also be an array containing all the descriptions.
		*/
		$.prettyPhoto.open = function(gallery_images,gallery_titles,gallery_descriptions) {
			// To fix the bug with IE select boxes
			if($.browser.msie && $.browser.version == 6){
				$('select').css('visibility','hidden');
			};
			
			if(settings.hideflash) $('object,embed').css('visibility','hidden'); // Hide the flash
			
			// Convert everything to an array in the case it's a single item
			images = $.makeArray(gallery_images);
			titles = $.makeArray(gallery_titles);
			descriptions = $.makeArray(gallery_descriptions);

			image_set = ($(images).size() > 0) ?  true : false; // Find out if it's a set

			// Hide the next/previous links if on first or last images.
			_checkPosition($(images).size());
		
			$('.pp_loaderIcon').show(); // Do I need to explain?
		
			// Fade the content in
			$pp_overlay.show().fadeTo(settings.animationSpeed,settings.opacity);

			// Display the current position
			$pp_pic_holder.find('.currentTextHolder').text((setPosition+1) + settings.counter_separator_label + $(images).size());

			// Set the description
			if(descriptions[setPosition]){
				$pp_pic_holder.find('.pp_description').show().html(unescape(descriptions[setPosition]));
			}else{
				$pp_pic_holder.find('.pp_description').hide().text('');
			};

			// Set the title
			if(titles[setPosition] && settings.showTitle){
				hasTitle = true;
				$ppt.html(unescape(titles[setPosition]));
			}else{
				hasTitle = false;
			};
			
			// Get the dimensions
			movie_width = ( parseFloat(grab_param('width',images[setPosition])) ) ? grab_param('width',images[setPosition]) : settings.default_width.toString();
			movie_height = ( parseFloat(grab_param('height',images[setPosition])) ) ? grab_param('height',images[setPosition]) : settings.default_height.toString();
			
			// If the size is % based, calculate according to window dimensions
			if(movie_width.indexOf('%') != -1 || movie_height.indexOf('%') != -1){
				movie_height = parseFloat(($(window).height() * parseFloat(movie_height) / 100) - 100);
				movie_width = parseFloat(($(window).width() * parseFloat(movie_width) / 100) - 100);
				percentBased = true;
			}

Написано более трёх лет назад

Александра Маслова @Alexandr94 Автор вопроса

// Fade the holder
			$pp_pic_holder.fadeIn(function(){
				imgPreloader = "";
				// Inject the proper content
				switch(_getFileType(images[setPosition])){
					case 'image':
						// Set the new image
						imgPreloader = new Image();

						// Preload the neighbour images
						nextImage = new Image();
						if(image_set && setPosition > $(images).size()) nextImage.src = images[setPosition + 1];
						prevImage = new Image();
						if(image_set && images[setPosition - 1]) prevImage.src = images[setPosition - 1];

						$pp_pic_holder.find('#pp_full_res')[0].innerHTML = settings.image_markup;
						$pp_pic_holder.find('#fullResImage').attr('src',images[setPosition]);

						imgPreloader.onload = function(){
							// Fit item to viewport
							correctSizes = _fitToViewport(imgPreloader.width,imgPreloader.height);

							_showContent();
						};

						imgPreloader.onerror = function(){
							alert('Image cannot be loaded. Make sure the path is correct and image exist.');
							$.prettyPhoto.close();
						};
					
						imgPreloader.src = images[setPosition];
					break;
				
					case 'youtube':
						correctSizes = _fitToViewport(movie_width,movie_height); // Fit item to viewport

						movie = 'http://www.youtube.com/v/'+grab_param('v',images[setPosition]);
						if(settings.autoplay) movie += "&autoplay=1";
					
						toInject = settings.flash_markup.replace(/{width}/g,correctSizes['width']).replace(/{height}/g,correctSizes['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,movie);
					break;
				
					case 'vimeo':
						correctSizes = _fitToViewport(movie_width,movie_height); // Fit item to viewport
					
						movie_id = images[setPosition];
						movie = 'http://vimeo.com/moogaloop.swf?clip_id='+ movie_id.replace('http://vimeo.com/','');
						if(settings.autoplay) movie += "&autoplay=1";
				
						toInject = settings.flash_markup.replace(/{width}/g,correctSizes['width']).replace(/{height}/g,correctSizes['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,movie);
					break;
				
					case 'quicktime':
						correctSizes = _fitToViewport(movie_width,movie_height); // Fit item to viewport
						correctSizes['height']+=15; correctSizes['contentHeight']+=15; correctSizes['containerHeight']+=15; // Add space for the control bar
				
						toInject = settings.quicktime_markup.replace(/{width}/g,correctSizes['width']).replace(/{height}/g,correctSizes['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,images[setPosition]).replace(/{autoplay}/g,settings.autoplay);
					break;
				
					case 'flash':
						correctSizes = _fitToViewport(movie_width,movie_height); // Fit item to viewport
					
						flash_vars = images[setPosition];
						flash_vars = flash_vars.substring(images[setPosition].indexOf('flashvars') + 10,images[setPosition].length);

						filename = images[setPosition];
						filename = filename.substring(0,filename.indexOf('?'));
					
						toInject =  settings.flash_markup.replace(/{width}/g,correctSizes['width']).replace(/{height}/g,correctSizes['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,filename+'?'+flash_vars);
					break;
				
					case 'iframe':
						correctSizes = _fitToViewport(movie_width,movie_height); // Fit item to viewport
				
						frame_url = images[setPosition];
						frame_url = frame_url.substr(0,frame_url.indexOf('iframe')-1);
				
						toInject = settings.iframe_markup.replace(/{width}/g,correctSizes['width']).replace(/{height}/g,correctSizes['height']).replace(/{path}/g,frame_url);
					break;
				
					case 'inline':
						// to get the item height clone it, apply default width, wrap it in the prettyPhoto containers , then delete
						myClone = $(images[setPosition]).clone().css({'width':settings.default_width}).wrapInner('<div id="pp_full_res"><div class="pp_inline clearfix"></div></div>').appendTo($('body'));
						correctSizes = _fitToViewport($(myClone).width(),$(myClone).height());
						$(myClone).remove();
						toInject = settings.inline_markup.replace(/{content}/g,$(images[setPosition]).html());
					break;
				};

				if(!imgPreloader){
					$pp_pic_holder.find('#pp_full_res')[0].innerHTML = toInject;
				
					// Show content
					_showContent();
				};
			});

		};
		
		/**
		* Change page in the prettyPhoto modal box
		* @param direction {String} Direction of the paging, previous or next.
		*/
		$.prettyPhoto.changePage = function(direction){
			if(direction == 'previous') {
				setPosition--;
				if (setPosition < 0){
					setPosition = 0;
					return;
				};
			}else{
				if($('.pp_arrow_next').is('.disabled')) return;
				setPosition++;
			};

Написано более трёх лет назад

Александра Маслова @Alexandr94 Автор вопроса

// Allow the resizing of the images
			if(!doresize) doresize = true;

			_hideContent(function(){$.prettyPhoto.open(images,titles,descriptions)});
			$('a.pp_expand,a.pp_contract').fadeOut(settings.animationSpeed);
		};
		
		/**
		* Closes the prettyPhoto modal box.
		*/
		$.prettyPhoto.close = function(){
			$pp_pic_holder.find('object,embed').css('visibility','hidden');
			
			$('div.pp_pic_holder,div.ppt,.pp_fade').fadeOut(settings.animationSpeed);
			
			$pp_overlay.fadeOut(settings.animationSpeed, function(){
				$('#pp_full_res').html(''); // Kill the opened content
				
				$pp_pic_holder.attr('style','').find('div:not(.pp_hoverContainer)').attr('style',''); // Reset the width and everything that has been set.
				_centerOverlay(); // Center it
			
				// To fix the bug with IE select boxes
				if($.browser.msie && $.browser.version == 6){
					$('select').css('visibility','visible');
				};
				
				// Show the flash
				if(settings.hideflash) $('object,embed').css('visibility','visible');
				
				setPosition = 0;
				settings.callback();
			});
			doresize = true;
		};
	
		/**
		* Set the proper sizes on the containers and animate the content in.
		*/
		_showContent = function(){
			$('.pp_loaderIcon').hide();

			// Calculate the opened top position of the pic holder
			projectedTop = scrollPos['scrollTop'] + ((windowHeight/2) - (correctSizes['containerHeight']/2));
			if(projectedTop < 0) projectedTop = 0 + $ppt.height();

			// Resize the content holder
			$pp_pic_holder.find('.pp_content').animate({'height':correctSizes['contentHeight']},settings.animationSpeed);
			
			// Resize picture the holder
			$pp_pic_holder.animate({
				'top': projectedTop,
				'left': (windowWidth/2) - (correctSizes['containerWidth']/2),
				'width': correctSizes['containerWidth']
			},settings.animationSpeed,function(){
				$pp_pic_holder.find('.pp_hoverContainer,#fullResImage').height(correctSizes['height']).width(correctSizes['width']);

				// Fade the new image
				$pp_pic_holder.find('.pp_fade').fadeIn(settings.animationSpeed);

				// Show the nav
				if(image_set && _getFileType(images[setPosition])=="image") { $pp_pic_holder.find('.pp_hoverContainer').show(); }else{ $pp_pic_holder.find('.pp_hoverContainer').hide(); }

				// Show the title
				if(settings.showTitle && hasTitle){
					$ppt.css({
						'top' : $pp_pic_holder.offset().top - 25,
						'left' : $pp_pic_holder.offset().left + 20,
						'display' : 'none'
					});

					$ppt.fadeIn(settings.animationSpeed);
				};
			
				// Fade the resizing link if the image is resized
				if(correctSizes['resized']) $('a.pp_expand,a.pp_contract').fadeIn(settings.animationSpeed);
				
				// Callback!
				settings.changepicturecallback();
			});
		};
		
		/**
		* Hide the content...DUH!
		*/
		function _hideContent(callback){
			// Fade out the current picture
			$pp_pic_holder.find('#pp_full_res object,#pp_full_res embed').css('visibility','hidden');
			$pp_pic_holder.find('.pp_fade').fadeOut(settings.animationSpeed,function(){
				$('.pp_loaderIcon').show();
				
				if(callback) callback();
			});
			
			// Hide the title
			$ppt.fadeOut(settings.animationSpeed);
		}
	
		/**
		* Check the item position in the gallery array, hide or show the navigation links
		* @param setCount {integer} The total number of items in the set
		*/
		function _checkPosition(setCount){
			// If at the end, hide the next link
			if(setPosition == setCount-1) {
				$pp_pic_holder.find('a.pp_next').css('visibility','hidden');
				$pp_pic_holder.find('a.pp_arrow_next').addClass('disabled').unbind('click');
			}else{ 
				$pp_pic_holder.find('a.pp_next').css('visibility','visible');
				$pp_pic_holder.find('a.pp_arrow_next.disabled').removeClass('disabled').bind('click',function(){
					$.prettyPhoto.changePage('next');
					return false;
				});
			};
		
			// If at the beginning, hide the previous link
			if(setPosition == 0) {
				$pp_pic_holder.find('a.pp_previous').css('visibility','hidden');
				$pp_pic_holder.find('a.pp_arrow_previous').addClass('disabled').unbind('click');
			}else{
				$pp_pic_holder.find('a.pp_previous').css('visibility','visible');
				$pp_pic_holder.find('a.pp_arrow_previous.disabled').removeClass('disabled').bind('click',function(){
					$.prettyPhoto.changePage('previous');
					return false;
				});
			};
			
			// Hide the bottom nav if it's not a set.
			if(setCount > 1) {
				$('.pp_nav').show();
			}else{
				$('.pp_nav').hide();
			}
		};
	
		/**
		* Resize the item dimensions if it's bigger than the viewport
		* @param width {integer} Width of the item to be opened
		* @param height {integer} Height of the item to be opened
		* @return An array containin the "fitted" dimensions
		*/
		function _fitToViewport(width,height){
			hasBeenResized = false;

			_getDimensions(width,height);
			
			// Define them in case there's no resize needed
			imageWidth = width;
			imageHeight = height;

			if( ((pp_containerWidth > windowWidth) || (pp_containerHeight > windowHeight)) && doresize && settings.allowresize && !percentBased) {
				hasBeenResized = true;
				notFitting = true;
			
				while (notFitting){
					if((pp_containerWidth > windowWidth)){
						imageWidth = (windowWidth - 200);
						imageHeight = (height/width) * imageWidth;
					}else if((pp_containerHeight > windowHeight)){
						imageHeight = (windowHeight - 200);
						imageWidth = (width/height) * imageHeight;
					}else{
						notFitting = false;
					};

					pp_containerHeight = imageHeight;
					pp_containerWidth = imageWidth;
				};
			
				_getDimensions(imageWidth,imageHeight);
			};

			return {
				width:Math.floor(imageWidth),
				height:Math.floor(imageHeight),
				containerHeight:Math.floor(pp_containerHeight),
				containerWidth:Math.floor(pp_containerWidth) + 40,
				contentHeight:Math.floor(pp_contentHeight),
				contentWidth:Math.floor(pp_contentWidth),
				resized:hasBeenResized
			};
		};

Написано более трёх лет назад

Александра Маслова @Alexandr94 Автор вопроса

/**
* Get the containers dimensions according to the item size
* @param width {integer} Width of the item to be opened
* @param height {integer} Height of the item to be opened
*/
function _getDimensions(width,height){
width = parseFloat(width);
height = parseFloat(height);

// Get the details height, to do so, I need to clone it since it's invisible
$pp_details = $pp_pic_holder.find('.pp_details');
$pp_details.width(width);
detailsHeight = parseFloat($pp_details.css('marginTop')) + parseFloat($pp_details.css('marginBottom'));
$pp_details = $pp_details.clone().appendTo($('body')).css({
'position':'absolute',
'top':-10000
});
detailsHeight += $pp_details.height();
detailsHeight = (detailsHeight <= 34) ? 36 : detailsHeight; // Min-height for the details
if($.browser.msie && $.browser.version==7) detailsHeight+=8;
$pp_details.remove();

// Get the container size, to resize the holder to the right dimensions
pp_contentHeight = height + detailsHeight;
pp_contentWidth = width;
pp_containerHeight = pp_contentHeight + $ppt.height() + $pp_pic_holder.find('.pp_top').height() + $pp_pic_holder.find('.pp_bottom').height();
pp_containerWidth = width;
}

function _getFileType(itemSrc){
if (itemSrc.match(/youtube\.com\/watch/i)) {
return 'youtube';
}else if (itemSrc.match(/vimeo\.com/i)) {
return 'vimeo';
}else if(itemSrc.indexOf('.mov') != -1){
return 'quicktime';
}else if(itemSrc.indexOf('.swf') != -1){
return 'flash';
}else if(itemSrc.indexOf('iframe') != -1){
return 'iframe'
}else if(itemSrc.substr(0,1) == '#'){
return 'inline';
}else{
return 'image';
};
};

function _centerOverlay(){
if(doresize) {
titleHeight = $ppt.height();
contentHeight = $pp_pic_holder.height();
contentwidth = $pp_pic_holder.width();

projectedTop = (windowHeight/2) + scrollPos['scrollTop'] - ((contentHeight+titleHeight)/2);

$pp_pic_holder.css({
'top': projectedTop,
'left': (windowWidth/2) + scrollPos['scrollLeft'] - (contentwidth/2)
});

$ppt.css({
'top' : projectedTop - titleHeight,
'left': (windowWidth/2) + scrollPos['scrollLeft'] - (contentwidth/2) + 20
});
};
};

function _getScroll(){
if (self.pageYOffset) {
return {scrollTop:self.pageYOffset,scrollLeft:self.pageXOffset};
} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
return {scrollTop:document.documentElement.scrollTop,scrollLeft:document.documentElement.scrollLeft};
} else if (document.body) {// all other Explorers
return {scrollTop:document.body.scrollTop,scrollLeft:document.body.scrollLeft};
};
};

function _resizeOverlay() {
windowHeight = $(window).height();
windowWidth = $(window).width();

$pp_overlay.css({
'height':$(document).height()
});
};

function _buildOverlay(){
// Inject the markup
$('body').append(settings.markup);

// Set my global selectors
$pp_pic_holder = $('.pp_pic_holder');
$ppt = $('.ppt');
$pp_overlay = $('div.pp_overlay');

$pp_pic_holder.attr('class','pp_pic_holder ' + settings.theme); // Set the proper theme

$pp_overlay
.css({
'opacity':0,
'height':$(document).height()
})
.bind('click',function(){
if(!settings.modal)
$.prettyPhoto.close();
});

$('a.pp_close').bind('click',function(){ $.prettyPhoto.close(); return false; });

$('a.pp_expand').bind('click',function(){
$this = $(this); // Fix scoping

// Expand the image
if($this.hasClass('pp_expand')){
$this.removeClass('pp_expand').addClass('pp_contract');
doresize = false;
}else{
$this.removeClass('pp_contract').addClass('pp_expand');
doresize = true;
};

_hideContent(function(){ $.prettyPhoto.open(images,titles,descriptions) });

$pp_pic_holder.find('.pp_fade').fadeOut(settings.animationSpeed);

return false;
});

$pp_pic_holder.find('.pp_previous, .pp_arrow_previous').bind('click',function(){
$.prettyPhoto.changePage('previous');
return false;
});

$pp_pic_holder.find('.pp_next, .pp_arrow_next').bind('click',function(){
$.prettyPhoto.changePage('next');
return false;
});
};

_centerOverlay(); // Center it
};

function grab_param(name,url){
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^]*)";
var regex = new RegExp( regexS );
var results = regex.exec( url );
if( results == null )
return "";
else
return results[1];
}
})(jQuery);

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

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

JavaScript

Простой
Возможно ли используя js очистить кешированные данные загруженных документов?
- 1 подписчик
- 15 часов назад
- 62 просмотра
1

ответ
JavaScript

Средний
Какой подойдет слайдер для кругового меню?
- 1 подписчик
- 18 часов назад
- 51 просмотр
0

ответов
JavaScript

+1 ещё

Простой
Почему таймер ускоряется?
- 1 подписчик
- вчера
- 130 просмотров
1

ответ
JavaScript

Средний
Как сделать звездный рейтинг?
- 1 подписчик
- 21 янв.
- 137 просмотров
1

ответ
JavaScript

+1 ещё

Средний
Как справиться с ошибками,которіе,вероятно не деают ничего сделать в плагине произольніх полей?
- 2 подписчика
- 21 янв.
- 110 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Использование PDFium через WASM в Node.js и альтернативы для анализа метаданных PDF?
- 1 подписчик
- 20 янв.
- 37 просмотров
2

ответа
JavaScript

+2 ещё

Простой
В чем может быть причина видимых разрывов в изображении составленном через чанки?
- 1 подписчик
- 20 янв.
- 91 просмотр
0

ответов
JavaScript

+4 ещё

Простой
Как повторить такую анимацию?
- 1 подписчик
- 20 янв.
- 302 просмотра
1

ответ
JavaScript

+2 ещё

Простой
Скриншот-тестирование отдельного компонента?
- 1 подписчик
- 19 янв.
- 70 просмотров
0

ответов
JavaScript

+1 ещё

Простой
Почему при нажатии на таймер он не останавливается?
- 1 подписчик
- 19 янв.
- 91 просмотр
1

ответ
Показать ещё Загружается…

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

Бэкэнд-разработчик JavaScript

Wanted. • Москва

от 250 000 до 400 000 ₽

JavaScript FullStack developer

Wanted. • Санкт-Петербург

До 220 000 ₽

Разработать генерации запроса для СПТ943 на python

23 янв. 2025, в 09:33

400 руб./за проект

Иллюстрация и анимация в live2d

23 янв. 2025, в 09:18

10000 руб./за проект

Битрикс 5 правок-задач

23 янв. 2025, в 04:47

10000 руб./за проект

видимо у тебя динамический контент с аякс подгрузкой. покажи код вызова
Александр Маслов, да, была подобная ошибка и у меня. В аякс запросе уходит на себя, но без https, когда урл подставляешь пхп переменной. В моем случае решилось так:
1. жестко прописал https в урле запроса.
2. убрал параметры '<?php echo config_item('base_url'); ?>buy/get_text_by_shop/' + s_id, и передавал их в data.
Айнур Валиев, а не могли бы вы описать по подробнее? А то все мои попытки тщетны, видимо что-то не то я делаю(
Александр Маслов, там где у тебя уходит аякс запрос
JsHttpRequest.query( ...
делай console.log урла и посмтри, что там уходит (https ли)
а также убери параметры g_id s_id с урла и передавай их в data (2-й параметр), то бишь
JsHttpRequest.query( address, // the path to backend data, // the JavaScript array with data you want to pass onreadyfunc(result, errors), // the function is called when an answer is ready nocache // if set to TRUE, caching will be disabled );

Answer 1 · 2019-01-15 01:20:21

После подключения SSL в основном бывают проблемы с ссылками. Может к стилям поменялся путь, но ошибка говорит об не правильном использовании типа. Там последовательно описаны где ошибки. Поокажите код.

Чем могут быть вызваны ошибки в jquery.prettyPhoto.js?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт