-moz-image-region

qborrd · №1

Извиняюсь если не туда пихнул тему. Проблема такая пока ни симанки, ни огнелис не поддерживают

*|* {crop: rect();}

но есть другое собственное свойство -moz-image-region, на xul planet написано, что с помощью этого свойства можно легко резать элементы с изображениями на нужные кусочки, как в спецификации Css3. Но это не работает
index.xml

<?xml version="1.0" encoding="koi8-r"?>
<?xml-stylesheet href="style.css" type="text/css"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">
<head><title /></head>
<body>
<div><object class="rect" data="image.png" type="image/x-png" /></div>
</body>
</html>

style.css

@charset "koi8-r";
.rect {-moz-image-region: rect(0px 10px 30px 30px);}

может быть для работы -moz-image-region нужно еще какие-то описание объекта, ну там например какой-нибудь -moz-box-* или еще что? Помогите пожалуйста, с xul дело просто не имел.

Отредактировано qborrd (27-06-2005 16:16:52)

vladmir · №2

qborrd

Но это не работает

Как это не работает?
Прямо сейчас вижу перед собой тему Pinball, в которой кнопки на -moz-image-region

Распакуй - посмотри как это делается - там CSS без особых финтифлюшек.

Mash · №3

Всё-таки что именно нужно? XUL или XHTML? Если первое, то

Выделить код

Код:

--- index.xml ---
<?xml version="1.0"?>
<?xml-stylesheet href="style.css" type="text/css"?>
<window id="someID"
        title="sometitle"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  <hbox class="rect">
    <image id="first"/>
    <image id="second"/>
    <image id="third"/>
    <image id="etc"/>
  </hbox>
</window>

--- style.css ---
.rect image {
    list-style-image: url("image.png");
    -moz-image-region: rect(0px 24px 24px 0px);
    width:24px;
    height:24px;
}
#second {-moz-image-region: rect(24px 24px 48px 0px)}
#third {-moz-image-region: rect(24px 24px 48px 0px)}
#etc {-moz-image-region: rect(48px 24px 72px 0px)}

qborrd · №4

Mash
Все понял, нужен xhtml, спасибо

qborrd · №5

как я понял для работы -moz-image-region нужно указывать ns зула, да? или нет, приведи пример для xhtml, пожалуйста.

а вообше я понял, что я делал не правильно... нужно было описать внешний узел, а уже его дети вырезаются

Отредактировано qborrd (27-06-2005 20:07:48)

Mash · №6

Если честно, то не задавался этим вопросом, но есть подозрение, что такое свойство будет работать только с XUL. Хотя и не уверен, смотреть надо.

В любом случае, раз уж это пропиетарщина, то можно пойти таким путём:

Выделить код

Код:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<head><title/></head>
<body>
  <xul:image style="list-style-image:url('image.png'); -moz-image-region:rect(48px 24px 72px 0px);"/>
</body>
</html>

Отредактировано Mash (27-06-2005 22:04:53)

Unghost · №7

==> Разработка

qborrd · №8

Mash
да, такойже пример сделал и я, думал есть другой вариант а жаль. Интересно вот еще что - где можно посмотреть график включения/поддержки новых свойств и селекторов css3?

qborrd · №9

эээ... все работает, а как тогда описать элемент в Css, нужно как-то экранировать двоеточие \: - не помогает.

Mash · №10

Экранировать нет необходимости. Вот такой код у меня работает на ура:

Выделить код

Код:

--- index.xml ---
<?xml version="1.0"?>
<?xml-stylesheet href="style.css" type="text/css"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<head><title/></head>
<body>
  <xul:image/>
</body>
</html>

--- style.css --
image {
   list-style-image: url("image.png");
   -moz-image-region: rect(48px 24px 72px 0px);
}

qborrd · №11

Mash
а у меня нет я про пример с xhtml.

Mash · №12

Могу архивчик выслать (xml+css+картинка). Сверимся. Надо?

qborrd · №13

ошибка была у меня, я разобрался, спасибо, все работает, жизнь прекрасна...

Полезная информация

№127-06-2005 16:09:06

-moz-image-region

№227-06-2005 18:33:40

Re: -moz-image-region

№327-06-2005 19:08:25

Re: -moz-image-region

Код:

№427-06-2005 20:02:26

Re: -moz-image-region

№527-06-2005 20:03:40

Re: -moz-image-region

№627-06-2005 22:03:03

Re: -moz-image-region

Код:

№727-06-2005 22:18:25

Re: -moz-image-region

№827-06-2005 22:37:24

Re: -moz-image-region

№927-06-2005 22:55:47

Re: -moz-image-region

№1027-06-2005 23:06:48

Re: -moz-image-region

Код:

№1128-06-2005 09:56:43

Re: -moz-image-region

№1228-06-2005 17:11:46

Re: -moz-image-region

№1328-06-2005 20:04:40

Re: -moz-image-region

Board footer