html5 и css3

[ANIK123]

Совсем недавно взялся снова за сайтостроение, а тут столько всего нового в мире появилось!..) Например PDO - новая для меня весчь, так же html5 и css3 - вобщем с диким энтузиазмом взялся изучать все это счастье
И тут возникла проблемка (я в нее сильно еще пока не вникал, но я вижу что тут топиков и так мало в этом разделе, поэтому пусть будет) с анимацией на css3
Воот код:

<article style="
{
	width:200px;
	height:100px;
	transform:rotateZ(1deg); 
	-moz-transition: transform 2s ease-in-out; 
	border: 1px solid black;
} 
:hover{
	transform:rotateZ(-1deg);
}
"></article>

По идее должно вроде бы получится как тута: сссссылка, но в итоге получаю только накрененный блок, без анимации
Если все это проделать в стиле css то все работает, но мне надо именно прямо в html это делать (через php скрипт, вставлять свои значения)
браузер firefox, если кто помнит эту тему)))))))

[moka]

http://jsfiddle.net/ChYC7/

Работает ок.
Используй jsfiddle чтобы делать примеры которые кто-то сможет сразу же отредактировать.

А при наводке чтобы вставить :hover данные - это нельзя делать. И вообще inline css - это не тру.
Если тебе нужна интерактивность, используй JS для этого и анимируй сам.
Используя PHP выводишь элемент типо такого:

<div class='block' data-degree="45"></div> 


Далее используя .attr в jQuery или аналогию без jQuery, читаешь эти данные и анимируешь.
Используя jQuery это просто и удобно.

[ANIK123]

ок, пусть будет так, теперь вообще ничего не видно
про jQuery это понятно, я вот о css3 говорю, но если это не "тру" то фиг с ним )))
upd: что посоветуете для безопасного хранения данных в mysql? да и в общем, что еще нового?

[Randomize]

Сообщение от ANIK123

ок, пусть будет так, теперь вообще ничего не видно

Инлайном (внутри тега) так стили не задают.
Вот рабочее решение: http://jsfiddle.net/VmgsN/3/

[moka]

Randomize, топик не читай, сразу отвечай? Зачем напрягался делал jsfiddle, если он уже был сделан во втором посту?

Сообщение от ANIK123

ок, пусть будет так, теперь вообще ничего не видно

Ну так у тебя inline стиль поломан. Это не проблема CSS3, это проблема твоего нензнания html.

Сообщение от ANIK123

про jQuery это понятно, я вот о css3 говорю, но если это не "тру" то фиг с ним )))

jQuery сам по себе и без CSS3 тебе не поможет. Т.к. трансформации - это CSS3 фичи, и ты можешь использовать jQuery только для их добавления / удаления.

Сообщение от ANIK123

upd: что посоветуете для безопасного хранения данных в mysql? да и в общем, что еще нового?

https://www.google.co.uk/search?q=my...a&channel=fflb
Главное чтобы тебе никто не вставил ничего в твой запрос в бд, что может тебе подпортить логику запроса, и напортачить. Это называется SQL Injection.

[ABTOMAT]

Увидел знакомые слова, обрадовался, зашёл.
css3 - анимация — фууу мерзость. Испугался, убежал. По-моему, самая бесполезная вещь в css3: она не умеет ничего, что нельзя сделать на JavaScript, но при этом ей нельзя управлять. Начорта мне анимация, которой я не могу управлять? Это как играть в Денди без джойстика.

Но раз уж тема зашла про jQuery.

Для анимации поворота (и ещё есть там масштабирования) использую вот: http://www.zachstronaut.com/posts/20...ate-scale.html
(Базарю вкусная пица пропробуй ещё захочеш)

Сообщение от ANIK123

upd: что посоветуете для безопасного хранения данных в mysql? да и в общем, что еще нового?

Только PDO, только хардкор. Про прямые запросы забудь (если не любитель приключений, я пердпочитаю иметь 100% защиту от инъекций).

[moka]

Сообщение от ABTOMAT

Увидел знакомые слова, обрадовался, зашёл.
css3 - анимация — фууу мерзость. Испугался, убежал. По-моему, самая бесполезная вещь в css3: она не умеет ничего, что нельзя сделать на JavaScript, но при этом ей нельзя управлять. Начорта мне анимация, которой я не могу управлять? Это как играть в Денди без джойстика.

Писать логику анимации в CSS3 - ну это да, глупо. Но описывать стили трансформации можно, и порой весьма удобно, т.к. нужны всего например 2 состояния блока, например небольшое увеличение с тенью позади (как будто к пользователю приближается). То тут очень удобно - описал стили, добави / убрал классы используя JS.

Сообщение от ABTOMAT

Но раз уж тема зашла про jQuery.

Для анимации поворота (и ещё есть там масштабирования) использую вот: http://www.zachstronaut.com/posts/20...ate-scale.html
(Базарю вкусная пица пропробуй ещё захочеш)

Я вот этот использую: http://ricostacruz.com/jquery.transit/
Да и сайт серьёзнее выглядит

[ABTOMAT]

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

[Skaner]

Собсна, вставлю свои 5 копеек))
Насчет CSS3, не люблю анимацию в ней, так как она иногда неадекватна... Да что там иногда, частенько!
jQ тоже не очень люблю, но использую, ибо все что нужно, там есть для удобства. Для анимирования jQuery и советую, имхо, менше будете заниматься анальными радостями, коих и так предостаточно в жизни программиста.. Да и валидность не хромает, в отличии от css3 и от "ж*п*лизания" всем браузерам, включая IE...
В html5 люблю все! Особенно canvas, вспоминается паскаль школьный)) Ностальжи)
А по сабжу, ну почти по сабжу, учить html5 и css3 рационально, так как это основа будущих приложений для Windows 8, и основа будущего ВЕБ'а... Вот))

Для Хранения данных используй paradox... pdo, сначала попаришься, но потом будет гораздо удобнее по сравнению с MySQL... Опять же ИМХО =)

[moka]

Skaner, для инфы - CSS3 - это состовляющая HTML5 спецификаций.