Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Изменение transform (https://javascript.ru/forum/misc/44180-izmenenie-transform.html)

Аленький цветочек 09.01.2014 23:54
Изменение transform
 
Есть div с тектом. Необходимо повернуть тект на заданный угол, те изменить transform, без jquery
<div id="text">Текст</div>

CSS:
Код:
#text{ 
    transform: rotate(0deg);
    position: absolute;
}
Делаю так:
var text = document.getElementById('text');
    var style1 = window.getComputedStyle(text,null);
    var top = style1.getPropertyValue('transform', 'rotate(15deg)');


Что я делаю не так? Извиняюсь за тупой вопрос.

BallsShaped 10.01.2014 00:19
Цитата:
Сообщение от Аленький цветочек
Что я делаю не так?
Тут, как бы, смотря, что вообще делаешь. Ибо, по представленному коду, вообще не понятно. Могу только сказать, что .getPropertyValue принимает только один аргумент.
Если я правильно понимаю, нужно что-то типа того:
document.getElementById('text')
    .style.transform = 'rotate(15deg)';

Faab 10.01.2014 00:20 
var eText = document.getElementById('text');
    eText.style.MozTransform = 'rotate(45deg)';
    eText.style.WebkitTransform = 'rotate(45deg)';
    eText.style.OTransform = 'rotate(45deg)';
    eText.style.MsTransform = 'rotate(45deg)';
    eText.style.transform = 'rotate(45deg)';


Ссылка

Аленький цветочек 10.01.2014 00:24
вначале я так и пробовала, но с transform такой номер не проходит. Ведь это не просто стиль типа color, а что-то вроде метода (тут могу лажать), у него есть куча вариантов rotate, scale...

Аленький цветочек 10.01.2014 00:25
Фигню написала, только что )))

Аленький цветочек 10.01.2014 00:30
Uncaught TypeError: Cannot read property 'style' of null
Не работает((((

Faab 10.01.2014 00:30
Цитата:
Сообщение от Аленький цветочек (Сообщение 291372)
Фигню написала, только что )))
:)


Мило. Но в css вам так и так надо прописывать все префиксы:
<style>
            -moz-transform: rotate(-0deg);
            -webkit-transform: rotate(-0deg);
            -o-transform: rotate(-0deg);
            -ms-transform: rotate(-0deg);
            transform: rotate(-0deg);
            position: absolute; 
</style>


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

Faab 10.01.2014 00:31
Цитата:
Сообщение от Аленький цветочек (Сообщение 291373)
Uncaught TypeError: Cannot read property 'style' of null
Не работает((((
У меня всё работает. Какой у вас браузер и выложите весь скрипт пожалуйста.

Аленький цветочек 10.01.2014 00:33
Просто, подставьте везде переменную вместо чисел и работы поубавиться, если вам снова понадобиться наклонить текст.
Ну я ж не совсем блондина. Как-то даже обидно стало.

Аленький цветочек 10.01.2014 00:35
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#text{
-moz-transform: rotate(-0deg);
-webkit-transform: rotate(-0deg);
-o-transform: rotate(-0deg);
-ms-transform: rotate(-0deg);
transform: rotate(-0deg);
}
</style>
</head>
<body>
<div id="text">Мур</div>
<script type="text/javascript">
function func(){
var eText = document.getElementById('text');
eText.style.MozTransform = 'rotate(45deg)';
eText.style.WebkitTransform = 'rotate(45deg)';
eText.style.OTransform = 'rotate(45deg)';
eText.style.MsTransform = 'rotate(45deg)';
eText.style.transform = 'rotate(45deg)';
}
func();
</script>
</body>
</html>
Не работает((( А должно Uncaught TypeError: Cannot read property \'style\' of null


Часовой пояс GMT +3, время: 19:16.
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице