Тень от текста и прямоугольника, закругленные углы и градиенты с официальным плагином jQuery - PullRequest
Новая
       35

Тень от текста и прямоугольника, закругленные углы и градиенты с официальным плагином jQuery

0 голосов
/ 03 октября 2010

Есть ли какой-нибудь официальный плагин jQuery (например, jQuery UI), который позволяет эти эффекты во всех браузерах?Или хотя бы IE8, Chome, FF и Opera.Я не хочу пользовательских плагинов, поскольку те, которые часто не имеют поддержки в долгосрочной перспективе, несовместимы друг с другом или не имеют постоянного качества и оптимизации.

На демонстрационной странице пользовательского интерфейса jQuery я видел некоторые «классы оверлея и тени», но я не могу найти какую-либо документацию по ним.Я думаю, что так часто желаемые функции должны быть включены в jQuery как-то?

Я буду благодарен за любую помощь!Заранее спасибо!

1 Ответ

2 голосов
/ 03 октября 2010

Нет «официального» способа сделать это, но есть прагматичный способ (который не имеет ничего общего с jQuery). Для некоторых сайтов я решил проблему полностью в CSS, используя комбинацию «подлинных» правил, специфичных для браузера версий, а затем файл CSS3 PIE htc (для IE). Пример: 

div.roundbox {
  border-radius: 8px;          // Official. Maybe someday.
  -webkit-border-radius: 8px;  // Webkit browsers
  -moz-border-radius: 8px;     // Firefox
  behavior: url(PIE.htc);      // IE
}

CSS3 PIE работает замечательно хорошо и, кажется, работает намного лучше, чем семейство решений IE7.js. По сути, вы помещаете эту же строку behavior в любые правила CSS, в которых используются border-radius, box-shadow и т. Д. Сценарий позаботится обо всем остальном и не повлияет на браузеры, отличные от IE, которые будут отображать эффекты через один из них. из первых трех директив.

Вы также можете собрать список всех ваших PIE-достойных объектов и объявить поведение за один выстрел (после обычных правил): 

div.shadowbox, div.roundbox, p.somethingelse { behavior: url(PIE.htc); }

Конечно, есть много места для дискуссий о целесообразности такого подхода, но во многих случаях он работает очень хорошо.

...