CSS 3 Pie подключение к Joomla - Joomla 1.5: Общие вопросы

Добрый всем вечер!

Никак не могу подключить CSS3 PIE, к Joomla. Вот ссылка, если кому понадобится: http://css3pie.com/
Этот небольшой файл позволяет делать хаки для IE 6 - 8 версии.

Скачиваю архив, распаковываю.
После этого в index.php между тегами body добавляю:

<?php
header( 'Content-type: text/x-component' );
include( 'css/PIE.htc' );
?>

в IE этот код обрабатывается и ошибок не выдает, значит всё работает корректно.
Но вот и подошли к неразрешимой мною ситуации:
файл pie.htc забрасываю в папку CSS, потом прописываю его в templateDetails.xml
в самом .css файле я прописываю (к примеру):

.myclass {
-moz-border-radius:0 0 35px 35px;
-webkit-border-radius:0 0 35px 35px;
border-radius:0 0 35px 35px;
box-shadow:0 1px 25px 1px #B2B2B2;
-webkit-box-shadow:0 1px 25px 1px #B2B2B2;
-moz-box-shadow:0 1px 25px 1px #B2B2B2;


behavior: url(PIE.htc);

}

строка behavior и определяет путь к файлу обработчику стилей.
И вот! Ничего и не работает. По разному менял пути к файлу, но так и не могу понять, что же надо сделать для получения CSS красоты в IE.

Мне тоже интересно как можно подключать CSS3?

зы. Експолуэр очь глючный.
В некоторых случаях, если это не 6-й экспл., может помочь подключение

а не смущает несколько неполный тип подключения?
htc подключаешь - молодец, но там еще в архиве и js кагбэ есть

In addition to the traditional PIE.htc behavior, the distribution now also includes a pure JavaScript version of the tool, PIE.js. While the .htc behavior is still the recommended approach for most users, the JS version has some advantages that may be a better fit for some users.

и пехапе кагбэ тоже с рекомендациями внутри...

Здравствуйте, уважаемый MaBudda!
Пожалуйста, если не сложно, если решили эту проблему с чертовым IE, скиньте по шагово - что Вы делаете, чтобы в Joomla всё заработало.

Буду очень признателен!
Только ответьте пожалуйста развернуто - что и куда копировать, что , где прописывать и т.д. еще раз спасибо!

Заранее спасибо!

Ну что-же, решение я нашел, хоть и потратил 3 дня, но я, в отличие от некоторых.... если решение нахожу, то всегда выкладываю пошаговую инструкцию для применения.

Если еще кто-то мучается, то радуйтесь, Вы нашли мой пост!

Инструкция:

Для border-radius: (для округления углов)


В стиль любого дива, на пример есть <div #1> вставляем

#1 {
        -moz-border-radius: 11px;
   -webkit-border-radius: 11px;
   border-radius: 11px;
   behavior: url(PIE.htc);
       -khtml-border-radius:14px;
}
Файл PIE.htc я скопировал в корень Joomla и в папку templates - всё заработало.

Использовал бордер радиус - для всех углов одинаковый, говорят, что для разных углов - в осле не потянет.

Внимание! У меня не получалось , и не получилось вот так - элемент вообще пропал - пропал его бордюр и его бакгроунд. Исправил так, нужно в свойства дива добавить position: relative; или position: absolute;
прописал position: relative;  и всё заработало!
Не добавлял никаких php, никаких скриптов, поэтому пусть тут некоторые помалкивают, которые только умеют строить из себя умников - сделали и сами!! и всё подробно расписали!



Для box-shadow: (для отбрасывания тени)
В стиль любого дива, на пример есть <div #1> вставляем

#1 {
   -moz-box-shadow: 10px 10px 20px #000;
   -webkit-box-shadow: 10px 10px 20px #000;
   box-shadow: 10px 10px 20px #000;
   behavior: url(ie-css3.htc);
        -khtml-box-shadow:10px 10px 20px #000;
}

не забываем скопировать файл ie-css3.htc в корень Joomla и в папку templates


Спасибо мне молодцу!

Что бы я ни делал, какой бы путь не прописывал, куда бы HTC ни запихивал, подключаться он отказывается.
Жаль, а так хотелось на осла уздечку закинуть...

Прописываю стили для таблицы из файла browse_listtable.tpl.php
Закидывал и в корень и в шаблон, все равно не пашет...

*html - уже не катит?

*html - уже не катит?

А что нужно в CSS прописать после *html для закругления?

да, запарился, извиняюсь.  поищу ссылку, где-то была.

Для Joomla получилось заставить работать css3 под ие 7,8, только одним спосбом:
Положить в корень Joomla 3 файла PIE (js, php, htc)
и подключить в css:
   -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
   border-radius: 3px;
        behavior: url(PIE.php);

И только так заработало!

 

Ну что-же, решение я нашел, хоть и потратил 3 дня, но я, в отличие от некоторых.... если решение нахожу, то всегда выкладываю пошаговую инструкцию для применения.

Работает только для главной страницы сайта, остальные не подключаются!

Получилось только прописав абсолютный путь, behavior:url(http://имя сайта/PIE.htc);
предварительно закинув PIE.htc в корень сайта!

Итак, уважаемые Joomlaводы. Перекопав просторы интернета в поисках решения и проведя несколько опытов нашел вот такой вот рабочий вариант:

Код ( взят с родного сайта http://css3pie.com):

И все замечательно работает в Joomla.
А теперь решение:
1. При указании behavior перед адресом необходимо поставить слеш "/", ведь скрипт ведет путь от корня сайта, и далее путь к папке где лежит ваш .htc файл. У меня он лежит в папке pie в корне сайта:
2. Обязательно присвоить элементу position: relative или absolute

Проверено на IE7, IE8.
100% работают: border-radius, box-shadow, linear-gradient. Остальное не пробовал.

Надеюсь вам тоже поможет. Удачи!
--------------------------------------------------------
P.S. Только что проверил на IE6 — РАБОТАЕТ!

ВЫВОД: При описанной процедуре скрипт гарантированно работает в Joomla в браузерах IE 6,7,8 и на всех страницах сайта.

В дополнение к предыдущему посту выкладываю скрины:

IE6


IE7


IE8


IE8 под Win7 (Вот только не знаю, это IE8 под семеркой так глючит, или скрипт PIE?

m_smirnoff молодец, выложил правильное решение, только дополню:
если Joomla стоит в подпапке к примеру вот недавно верстал http://viprub4ik.ru/lcz/ то есть путь идет от доменного имени
путь к pie.htc будет начинаться с той папки где стоит Joomla у меня эта папка lcz
behavior: url(/lcz/pie/PIE.htc);

100% работают: border-radius, box-shadow, linear-gradient. Остальное не пробовал.

остальное и не поддерживается в pie.

можно и так
http://www.artlebedev.ru/tools/technogrette/html/filters-in-ie/

решение ниже

чтобы PIE.htc заработал в Joomla (НА ВНУТРЕННИХ СТРАНИЦАХ!)надо отключить поддержку ЧПУ в панели администрирования Joomla, во всяком случае в версии 1.7 все получилось, позже проверю в остальных, к тому же надо решить вопрос поддержки ЧПУ в таком случае, если кто найдет решение- отпишитесь!

Не нужно отключать ЧПУ это бред, все норм работает как без ЧПУ так и сним!

чтобы IE7+ поддерживал css3 на сайте, управляемый Joomla! необходимо:
1.  htaccess.txt переименовать в .htaccess и включить в панели администрирования ЧПУ (у кого Joomla! 1.7  "Включать название сайта в заголовок страницы" - ставим НЕТ)
2.  в файле стилей указать абсолютный адрес к файлу PIE.htc -  Например: behavior:url(http://www.reclinic.ru/js/PIE.htc);  

применил в разработке сайта www.reclinic.ru закругление углов в осле и на главной работает и на внутренних разделах.

Разобрался, необходимо htaccess.txt переименовать в .htaccess и включить в панели администрирования ЧПУ, без этого не работало в осле

То что разобрались это хорошо, молодец. А тот пост лучше потрите, а то люди будут входить в заблуждение.

По моим наблюдениям файлы .htc не цепляются на денвере, поэтому подключал через PHP файл. В CSS behavior: url(/pie/PIE.php); а уже в шаблоне
НО! В опере и осле не показывается текст из блока. Может быть кто то сталкивался с этим?

прыгаю до потолка))) получилось подключить всем спасибо!
делала так:
в css
 #xxx{
   padding: 10px 0px;
   position:relative;
  border: 1px solid black;
  width: 100%;
  height: 100%;
  behavior: url(/pie/PIE.htc);
  background:#fff;
  box-shadow: 10px 10px 5px #888;
  border-radius: 10px;
  -webkit-box-shadow: 10px 10px 5px #888;
  -webkit-border-radius: 10px;
  -moz-box-shadow:  10px 10px 5px #888;
  -moz-border-radius: 10px;
}
 в корень сайта закинула папку pie в которую извлекла архив, который скачала с сайта разработчиков CSS pie
 Если без архива киуть только PIE.htc то в IE 7 вообще div не отображается

Мне тоже интересно как можно подключать CSS3?

Вот я тупая была...

чтобы все скрипты относящиеся к шаблону лежали в его директории, я в файле index.php шаблона прописал так
<!--[if lte IE 9]>
<style>
*{
behavior: url(<?= $this->baseurl ?>/templates/<?= $this->template; ?>/css/PIE-2.0beta1/PIE.htc);
}
</style>
<![endif;]-->
соответственно распакованная директория с файлами pie у меня лежит в папке CSS шаблона.