Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: JS SVG, CSS - вертикальный текст
 
 автор: neoshinji   (07.10.2008 в 00:01)   письмо автору
 
 

Здравствуйте, оч надеюсь на помощь!

Сделал вот такой вот вертикальный текст: http://lysenka.net/web/8/
function GetVerticalLayout()
{
   /* Параметры */
   var fontFamily = "Arial"; /* задаем шрифт */
   var fontSize = 12; /* задаем размер шрифта */
      
   var notIE = !(navigator.appVersion.indexOf("MSIE") != -1 && navigator.systemLanguage);
   var supportSVG = document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#SVG", "1.1");

   if (notIE && supportSVG)
   {
      /* Собираем все ячейки */
      var td = document.getElementsByTagName("td");
      
      /* Находим ячейки с классом vertical и заменяем в них текст svg-изображением */
      var objElement = document.createElement("object");
      
      for(i = 0; i < td.length; i++)
      {
         if (td[i].className.match(/vertical/i))
         {
            var text = td[i].innerHTML;
            var h = td[i].clientHeight;
            var w = td[i].clientWidth;
            
            var obj = objElement.cloneNode(true);
            obj.height = (h > w) ? h : w;
            obj.type = "image/svg+xml";
            obj.width = fontSize + 2;
            obj.data = "data:image/svg+xml;charset/windows-1251,<svg xmlns='http://www.w3.org/2000/svg'><text x='" + (- obj.height/2) + "' y='" + fontSize + "' style='font-family:" + fontFamily + "; font-size:" + fontSize + "px; text-anchor:middle' transform='rotate(-90)'>" + text + "</text></svg>";
            td[i].replaceChild(obj, td[i].firstChild);
         }
      }
   }
}

Но в Опере и Лисе не могу сделать шрифт вертикального текста жирным и белым цветом
Помогите, пожалуйста!

  Ответить  
 
 автор: elenaki   (07.10.2008 в 10:00)   письмо автору
 
   для: neoshinji   (07.10.2008 в 00:01)
 

а в стиле, где вы указываете font-family, font-size, разве нельзя указать еще и color и font-weight: bold;?
или кривые браузеры этого не понимают? ;)

  Ответить  
 
 автор: neoshinji   (07.10.2008 в 21:48)   письмо автору
 
   для: elenaki   (07.10.2008 в 10:00)
 

В опере font-weight заработал, а в firefox ничего, цвет вообще не выходит.
Видимо, это нужно ещё такой же скрипт написать, чтобы данные изменения вступили в силу.
Но я в javascripts NULL, так что и попросил помощи.
Я не верю в тот факт, что в компе подобную фигню нельзя сделать.
Но заказ горит, буду картинками теперь >__<

  Ответить  
 
 автор: Nytrogen   (07.10.2008 в 21:51)   письмо автору
 
   для: neoshinji   (07.10.2008 в 21:48)
 

Лучше потянуть с заказом, чем выводить картинками =)
Покажите, как Вы реализовали font-weight и color.

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования