Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 30.05.2012, 19:57
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote Посмотреть сообщение
zoom: N; /* для IE */
transform: scale(...); /* для остальных */
<оффтопик>

жаль, что zoom изменяет размер не векторно, а расторно.

есть ли способ с помощью фильтров изменить размер векторным образом?

</оффтопик>
Ответить с цитированием
  #12 (permalink)  
Старый 30.05.2012, 20:24
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

я тут http://webandad.com/ использовал zoom и scale вроде нормально, единственное проблема в ИЕ, то что zoom размер меняет к центру а scale к левому-верхнему углу. Или наоборот, точно не помню уже
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #13 (permalink)  
Старый 30.05.2012, 22:11
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

devote, у него и с фильтром поворота тоже беда - он по-другому поворачивает*. поэтому поворот "как во всех браузерах" можно сделать только тогда, когда есть под рукой элемент, а не CSSStyleDeclaration . и это печально.


*величина "кривизны" зависит от размеров элемента


PS. что-то я вспомнил про expressions... хм, может, еще получится сделать нормальный поворот, не имея на руках элемент.

Последний раз редактировалось melky, 30.05.2012 в 22:13.
Ответить с цитированием
  #14 (permalink)  
Старый 31.05.2012, 00:11
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
PS. что-то я вспомнил про expressions... хм, может, еще получится сделать нормальный поворот, не имея на руках элемент.
expression конечно хорошо, но вот проблема в том что ИЕ8 не поддерживает expression, тут и попа вся.. а так для эмуляции rotate в IE7 и ниже я пользовался таким хаком:

Работает во всех браузерах кроме ИЕ8
<style type="text/css">
	#to_rotate {
		position: absolute;
		width: 100px;
		height: 100px;
		background-color: #f00;

		filter:expression("progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',M11="+(this.style.Rotate?1:(this.style.Rotate=0),(this.xWidth?1:(this.xWidth=this.offsetWidth,this.xHeight=this.offsetHeight,1)),(this.style.marginLeft=(-Math.round((this.offsetWidth-this.xWidth)/2))+"px"),(this.style.marginTop=(-Math.round((this.offsetHeight-this.xHeight)/2))+"px"),Math.cos((this.style.Rotate*Math.PI)/180.0))+",M12="+(-(Math.sin((this.style.Rotate*Math.PI)/180.0)))+",M21="+(Math.sin((this.style.Rotate*Math.PI)/180.0))+",M22="+(Math.cos((this.style.Rotate*Math.PI)/180.0))+")");
	}
</style>
<div style="position: relative;">
	<div id="to_rotate">test text</div>
</div>
<script type="text/javascript">
	setInterval(function() {
		var el = document.getElementById('to_rotate');

		// специальное свойство для IE ниже восьмой версии
		el.style.Rotate = (el.style.Rotate||0) + 2;

		// для все остальных
		el.style.OTransform =
		el.style.MozTransform =
		el.style.WebkitTransform =
		el.style.msTransform =
		el.style.transform = "rotate(" + el.style.Rotate + "deg)";
	}, 50);
</script>
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine

Последний раз редактировалось devote, 31.05.2012 в 01:04.
Ответить с цитированием
  #15 (permalink)  
Старый 31.05.2012, 01:03
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

если кому то нужно кросс-браузерный rotate с помощью скриптов, то вот:
<style type="text/css">
	#to_rotate {
		position: relative;
		width: 100px;
		height: 100px;
		background-color: #f00;
	}
</style>

<div id="to_rotate">test text</div>

<script type="text/javascript">

	function rotateElem( elem, deg ) {

		var style = elem.style;

		if ( elem.ownerDocument && elem.ownerDocument.defaultView ) {
			style = elem.ownerDocument.defaultView.getComputedStyle( elem, null );
		} else if ( elem.currentStyle ) {
			style = elem.currentStyle;
		}

		if ( eval("/*@cc_on @_jscript_version;@*/") <= 5.8 ) {

			var rad = ( deg * Math.PI ) / 180.0,
				cos = Math.cos(rad),
				sin = Math.sin(rad);

			elem.originalWidth = elem.originalWidth || elem.offsetWidth;
			elem.originalHeight = elem.originalHeight || elem.offsetHeight;

			elem.style.filter = style.filter.replace( /progid:DXImageTransform.Microsoft.Matrix\([^)]*\)[;]?/g, "" ) +
				"progid:DXImageTransform.Microsoft.Matrix("+
				"sizingMethod='auto expand',M11="+cos+",M12="+(-sin)+",M21="+sin+",M22="+cos+")";

			elem.style.marginLeft = -Math.round( ( elem.offsetWidth - elem.originalWidth ) / 2 );
			elem.style.marginTop =- Math.round( ( elem.offsetHeight - elem.originalHeight ) / 2 );
		} else {
			var Transform = (
				style.transform ||
				style.OTransform ||
				style.MozTransform ||
				style.WebkitTransform ||
				style.msTransform
			)+"";

			elem.style.OTransform =
			elem.style.MozTransform =
			elem.style.WebkitTransform =
			elem.style.msTransform =
			elem.style.transform =
				Transform.replace( /(none|[\s]?(rotate|matrix)\([^)]*\))/g, "" ) + " rotate(" + deg + "deg)";
		}
	}

	setInterval((function(){
		var start = 0;
		return function() {
			rotateElem( document.getElementById('to_rotate'), start+=2 );
		}
	})(), 50);

</script>
работает во всех браузерах.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #16 (permalink)  
Старый 31.05.2012, 01:36
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote
expression конечно хорошо, но вот проблема в том что ИЕ8 не поддерживает expression, тут и попа вся..
вот вот... ни expressions, ни -ms-transform.

тогда.. придется только для него получать список элементов (слава Богу, он поддерживает querySelectorAll - кстати, не без глюков?).

получается объёмненько, если так ветвиться - три раза. но это уже лучше, чем ничего
Ответить с цитированием
  #17 (permalink)  
Старый 31.05.2012, 02:20
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
кстати, не без глюков?
да вроде не наблюдалось. Единственное что CSS3 селекторы он не держит, а так норм вроде.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #18 (permalink)  
Старый 31.05.2012, 14:36
Аспирант
Отправить личное сообщение для hadzhimuratov Посмотреть профиль Найти все сообщения от hadzhimuratov
 
Регистрация: 30.05.2012
Сообщений: 37

Deff, спасибо,страница уменьшилась : )
А можно задать какой то определенный размер страницы в % или px????

Теперь объясните пожалуйста как вставить эту страницу в DIV???

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

Последний раз редактировалось hadzhimuratov, 31.05.2012 в 14:39.
Ответить с цитированием
  #19 (permalink)  
Старый 31.05.2012, 15:22
Аватар для Раед
''
Отправить личное сообщение для Раед Посмотреть профиль Найти все сообщения от Раед
 
Регистрация: 11.12.2011
Сообщений: 636

Сообщение от hadzhimuratov
Теперь объясните пожалуйста как вставить эту страницу в DIV???
Страницы обычно в iframe вставляют
Ответить с цитированием
  #20 (permalink)  
Старый 31.05.2012, 15:33
Аспирант
Отправить личное сообщение для hadzhimuratov Посмотреть профиль Найти все сообщения от hadzhimuratov
 
Регистрация: 30.05.2012
Сообщений: 37

Раед, да, но только когда я вставляю страницу уменьшенную в iframe, то размер опять становиться прежним : (
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как передать код html страницы из фрейма на сервер vuler Общие вопросы Javascript 5 20.02.2012 15:31
Как передать значение по ссылке на другую страницу сайта Rollo Общие вопросы Javascript 7 18.10.2010 15:02
Поиск слова в исходном коде html страницы klsorat2010 Ваши сайты и скрипты 1 20.05.2010 23:46
Загрузка внешнего html файл на страницу GRean (X)HTML/CSS 3 26.04.2010 14:16
Вставка скрипта в HTML страницу dorn Общие вопросы Javascript 5 14.10.2009 07:39