Jump to content

Report

  • Similar Content

    • By Vic-Tor
      Подскажите пожалуйста, как сделать паузу мерцания текста, что бы по глазам не било сильно?
      Посмотреть образец  тут.
      info-box {
      width : 96%;
      background : #c2ddf9;
      border : #CD0000 solid 1px;
      color : #CD0000; font-weight: 800;
      line-height : 19px;
      animation: blur .99s ease-out infinite;
      text-shadow: 0px 0px 2px #fff, 0px 0px 2px #fff;
      }
      @keyframes blur {
        from {
          text-shadow:0px 0px 5px #fff,
            0px 0px 4px #fff, 
            0px 0px 5px #fff,
            0px 0px 5px #fff,
            0px 0px 5px #fff,
            0px 0px 5px #fff,
            0px 0px 9px #fff,
            0px 0px 9px #fff,
            0px 0px 9px #fff,
            0px 0px 9px #fff,
            0px 0px 9px #CD0000,
            0px 0px 9px #CD0000,
            0px 10px 12px #4A708B,
            0px 10px 12px #4A708B,
            0px 10px 12px #4A708B,
            0px 10px 12px #4A708B,
            0px -10px 12px #4A708B,
            0px -10px 11px #4A708B;
        }
      }
      СПАСИБО!
    • By forest_moss
      всем привет.
      у меня появилась проблема того, что тень текста дико коверкается в сафари и в браузере телефона.
      неужели этого никак не избежать!?
      может, есть какие-нибудь решения, ведь наверно же с этим сталкивались многие другие?


      вот пример, здесь все минимизировано:
      скришот в разных браузерах:

      код:
      <!DOCTYPE html><html><head><meta charset="utf-8"> <title>font</title><style>    body{background: #e5e08b;}    p{    font-family: arial;    color: #ffe;    font-weight:bold;    text-shadow: 0 0 .1ex #ba0, 0 0 .1ex #870, 0 0 .1ex #870,    0 .7ex .1ex #fff,    2ex 0 .5ex #ffd, -2ex 0 .5ex #ffd;    }</style></head><body>        <p>Lorem ipsum</p></body></html>вот даже ссылка, если кому интересно.

      Есть идеи, как правильно обращаться с этой тенью???
      или хотя бы как исправить ситуацию в данном случае...
    • By only_dimon
      Доброго времени суток уважаемые форумчане.
      Реализовать text-shadow для статичного текста в ранних IE не проблема, благо есть фильтры, плагины jQuery и техника подложки.
      Столкнулся с проблемами добавления text-shadow тексту на кнопке и в поле ввода.
      1. Кнопка
      Условия: кнопка с градиентом, тенью и текстом с тенью. Скриншот
      Попытки:
      a) Реализовать просто <a>: не универсально при желании использовать input[button], фильтры и плагин jqueryTextShadow создают тень для всего блока <a>, не только текста.
      б) Реализовать <а><span>text</span></a>: опять же не подходит для input[button] и span блокирует ховеры и клики по кнопке в IE (сделать его прозрачным - не будет текста, сделать z-index - 1 - не будет видно за заливкой).
      c) Реализовать


      <span class="button_green"><input type="button" class="action" /><span class="text">Перенесите меня обратно</span><span class="bg"></span></span>

      .action - прозрачная кнопка или ссылка на всю площадь контейнера с z-index: 10
      .text - текст с тенью c z-index: 5
      .bg - блока на всю площадь контейнера с заливкой и тенью z-index: 1
      Расположение получилось как надо: кнопка с действием наверху, под ней текст с тенью, а под ним заливка.
      Но!
      Проблема в реализации ховеров, эктивов и фокусов.

      .button_green .action:hover + .text + .bg {}
      не работает нигде

      .button_green:hover .bg {}
      не работает в IE, так как .action закрывает собой родителя полностью
      Больше ломать голову сил нету. Давайте ломать вместе или может есть решение проще, а я упустил.
      2.
      input[type=text], input[type=password]
      Условия: текст с тенью в IE. Скриншот
      Попытку реализации еще не сделал: создать поверх div с content editable и необходимым дизайном. по средствам JS синхронизовать изменение текста. Есть ли способ проще? И может быть вообще без JS?
      Заранее спасибо за ответы.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy