Справочник по CSS : Фильтры в Internet Explorer : Динамические фильтры : RandomDissolve

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


RandomDissolve()

Создает эффект поточечного появления нового содержимого на месте старого


Синтаксис фильтра RandomDissolve():

Где: Общий пример использования: Совместимость:
HTML <ELEMENT STYLE="filter:progid:DXImageTransform.Microsoft.RandomDissolve(sProperties)" ... > Internet Explorer 5.5 или выше
Script object.style.filter="progid:DXImageTransform.Microsoft.RandomDissolve(sProperties)" Internet Explorer 5.5 или выше

Здесь sProperties - строка, содержащая один или несколько свойств, задающих поведение фильтра.


Свойства, используемые в фильтре RandomDissolve():

Атрибуты
Исползуются в HTML
Свойства
Исползуются в скриптах
Описание
duration Duration Задает или возвращает продолжительность преобразования в секундах.
enabled Enabled Задает или возвращает признак разрешения применения фильтра.
Свойство может принимать следующие значения
  • true - разрешает применить фильтр (значение по умолчанию)
  • false - не разрешает
Percent Задает процент выполнения преобразования.
Может принимать значения от 0 (преобразование еще не началось) до 100 (преобразование закончено).
Status Возвращает состояние выполнения преобразования.
Свойство может принимать следующие значения
  • 0 - если преобразование было остановлено
  • 1 - если оно было применено
  • 2 - если преобразование выполняется


Методы, которые могут быть применены к фильтру RandomDissolve():

Метод Описание
apply Замораживает элемент страниы, после чего вы можете делать с ним все, что хотите.
Для того, чтобы запустить преобразование, используйте метод Play().
play Запускает преобразование.
stop Немедленно останавливает преобразование.


Примеры использования динамического фильтра RandomDissolve():

Пример 1:

<SCRIPT>
var bToggle = 0;
function fnToggle() {
    oDiv.filters[0].Apply();                   
// После того, как применяется метод Apply к выбранному объекту
// фильтр не запустится пока не будет вызван метод Play

    if (bToggle) {                                                        
        bToggle = 0;
        oDiv.style.visibility="visible";  }  
    else {
        bToggle = 1;
        oDiv.style.visibility="hidden"; }
    oDiv.filters[0].Play();
}
</SCRIPT>

<BUTTON onclick="fnToggle()">Запустить преобразование</BUTTON><BR/><BR/>
<DIV ID="oDiv" STYLE="height:250px; width:250px; background-color: gold;
                filter:progid:DXImageTransform.Microsoft.RandomDissolve(
                duration=3);">
	<FONT SIZE="+4" COLOR="#A08000">
        TEXT<BR/>TEXT<BR/>TEXT<BR/>TEXT<BR/>
	</FONT>
</DIV>

Пример 2:

<!-- К этому элементу применяется фильтр. -->

<DIV ID="oTransContainer" STYLE="position:absolute; top: 0px; left: 0px; width: 300px; 
height:300px;  filter:progid:DXImageTransform.Microsoft.RandomDissolve() ">

<!-- Это первое содержимое, которое будет показано. -->

    <DIV ID="oDIV1" STYLE="position:absolute; top:50px; left:10px; width:240px; height:160px;
    background:gold"> This is DIV #1  </DIV>

<!-- Это содержимое, которое будет показано после применения фильтра. -->

    <DIV ID="oDIV2" STYLE="visibility:hidden; position:absolute; top:50px; left:10px; 
    width:240px; height:160px; background: yellowgreen; "> <BR> This is DIV #2
    </DIV> 
</DIV>

<BUTTON onclick="fnToggle()">Запустить преобразование</BUTTON>

<SCRIPT>
var bTranState = 0;
function fnToggle() {
    oTransContainer.filters[0].Apply();
    if (bTranState=="0") { 
		bTranState = 1;
        oDIV2.style.visibility="visible"; 
		oDIV1.style.visibility="hidden";}
    else {  
		bTranState = 0;
        oDIV2.style.visibility="hidden"; 
		oDIV1.style.visibility="visible";}
    	oTransContainer.filters[0].Play();}
</SCRIPT>
Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="https://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования