Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Задание масштаба по умолчанию (https://javascript.ru/forum/dom-window/33855-zadanie-masshtaba-po-umolchaniyu.html)

Darth_Ololo 11.12.2012 13:19

Задание масштаба по умолчанию
 
Добрый день, столкнулся со следующей проблемой - на странице имеется вывод изображения
<div id="fPic_ac" name="fPic_ac" class="fPic_ac">
  <div id="iPic_ac" name="iPic_ac" >
	<img src="filepath"  name="Image_ac" id="Image_ac" style="cursor: move;" />
  </div>
</div>

и небольшое меню масштабирования этого изображения
<div id="fZoom_ac" name="fZomm_ac" class="fZoom_ac">
		<b>Масштаб: </b> 
		<input type="text" name="zoomText_ac" id="zoomText_ac" value="100" style="width: 50px;" onkeyup="zoomM(this.value);" /> 
		<a onClick="zoomM('-20')">
			<span class="button_ac">-</span>
		</a> 
		<a onClick="zoomM('+20')">
			<span class="button_ac">+</span>
		</a>  
		<a href="#" onClick="zoomM('100'); return false;" class="link_ac">100%</a>  
		<a href="#" onClick="zoomM('all'); return false;" class="link_ac" >Изображение целиком</a>
	</div>


Скрипт отвечающий за это безобразие http://learn.javascript.ru/play/1xSq0

На данный момент первоначальный масштаб составляет 100%, дабы уменьшить пытался на автозагрузку страницы кинуть click ссылки Изображение целиком, но выводится пустой див.

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

ОлегА 11.12.2012 15:01

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

Darth_Ololo 11.12.2012 15:22

На экране див с заданными размерами (рамка грубо говоря) в нем это изображение-чертеж выводится. По умолчанию масштаб идет 100%, при котором получается половина чертежа на всю эту рамку. Само масштабирование работает, из сотни спокойно можно уменьшить и увеличить масштаб нажимая на кнопки, но необходимо начальный масштаб уменьшить хотя бы вдвое, чтобы был виден весь чертеж целиком, это в пределах 40-45%, только вот как это делается не приложу ума.

Или при загрузке страницы задавать значение onkeyup="zoomM(this.value);" инпута нужным процентом, в нем на странице вручную указывается процент масштаба?

ОлегА 11.12.2012 16:33

не юзал zoomM и не знаю как он работает, у вас получается просто очень большое изображение, попробуйте img with=100% сделать, и div'у в котором он тоже задать width и тогда img должен умещаться в див, хотя точно тут не могу сказать тут надо смотреть стили которые применяются на все это хозяйство

Darth_Ololo 11.12.2012 17:19

из скрипта который использовался в этом всем деле вроде как zoomM рукописная функция
// Расчет масштаба  	
  	function zoomM(prc)
  	{	
            element = getElement('zoomText_ac');  	    
  	    if (prc.substr(0,1) == '+' || prc.substr(0,1) == '-')
  	    	zoom = (parseInt(element.value) + parseInt(prc));  	   
  	    else if (prc == 'all')
  	  	{
	  	      area = getElement('fPic_ac');
	  	      if (picWidth > picHeight) zoom = Math.round((parseInt(area.style.height)/picHeight) * 100);
	  	      else zoom = Math.round((parseInt(area.style.width)/picWidth) * 100);
  	    	}
  	    else 
  	    	zoom = prc;
	    element.value = zoom;
	    pictureZoom(zoom);
  	}


изменение ширины изображение на 100% не подойдет

ОлегА 11.12.2012 18:53

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


Часовой пояс GMT +3, время: 15:18.