Chrome таргетированный CSS - PullRequest
Новая
       9

Chrome таргетированный CSS

1 голос
/ 21 апреля 2010

У меня есть некоторый код CSS, который скрывает курсор на веб-странице (это клиент, обращенный к статическому экрану без взаимодействия).Код, который я использую для этого:мой локальный сервер, но когда я загружаю на веб-сервер Windows CE (наш производственный модуль), курсор представляет собой черный ящик.Странно.

После некоторого тестирования кажется, что у chrome проблема только с полностью пустыми файлами курсора при подаче с веб-сервера WinCE, поэтому я создал пустой курсор с одним пикселем белого цвета, специально для chrome.Как мне тогда нацелить это правило CSS на хром?то есть 

*, html { cursor: url('/web/resources/graphics/blank.cur'), pointer; }
<!--[if CHROME]>
*, html { cursor: url('/web/resources/graphics/blankChrome.cur'), pointer; }
<![endif]-->

Ответы [ 4 ]

3 голосов
/ 21 апреля 2010

Переверните CSS, нацеливаясь на IE вместо: 

*, html { cursor: url('/web/resources/graphics/blankChrome.cur'), pointer; }
<!--[if IE]>
*, html { cursor: url('/web/resources/graphics/blank.cur'), pointer; }
<![endif]-->

Кроме того, согласно https://developer.mozilla.org/en/Using_URL_values_for_the_cursor_property Firefox и Safari (и предположительно Chrome) поддерживают GIF-файлы для курсоров, поэтому вы можете попробовать использовать прозрачный GIF размером 1 пиксель.

3 голосов
/ 21 апреля 2010

Chrome не имеет никаких условных комментариев, как в IE.

Моей первой идеей было использовать немного Javascript, чтобы очень быстро просмотреть строку useragent, а затем снова применить стиль с помощью javascript. Если вы уже используете jQuery, это будет довольно просто.

3 голосов
/ 21 апреля 2010

Когда у меня возникла похожая проблема, я выполнил эту проверку на стороне сервера. Единственный способ, который я смог найти, - это прослушать пользовательский агент. Здесь с точки зрения Rails. 

<% if request.env["HTTP_USER_AGENT"] =~ /chrome/i %>
  <%= stylesheet_link_tag "chrome" %>
<% end>
2 голосов
/ 21 апреля 2010

body:nth-of-type(1) { cursor: url('/web/resources/graphics/blank.cur'), pointer; } только для Google Chrome;) 

<script type="text/javascript">
if (/Chrome[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Chrome/x.x 
 var cversion=new Number(RegExp.$1);
 if (cversion>1)
    with(document) {
    //start the css
    write("<style type='text/css'>");
    write("html { cursor: url('/web/resources/graphics/blank.cur'), pointer; }");
    write("</style>");
  }
}
</script>

На основании комментария Оли.

...