2010-02-25 9 views
5

Czy jest jakiś sposób przywrócenia stylu z powrotem do tego, co jest w moim CSS?Prototype.js: reset setStyle

Przykład:

#foo {width: 50px; height: 50px; position: absolute; top: 150px; left: 250px;} 


function moveFoo(newpostop, newposleft){ 
    $('foo').setStyle({top: newpostop+'px', left: newposleft+'px'}); 
} 

Teraz, kiedy jestem z nim zrobić, chciałbym przenieść foo wstecz, kiedy to było. Wiem, że to może być trudne, ale muszę to zrobić z 25 różnymi divami.

Dzięki

Odpowiedz

5

Ustawienie styl nie eliminuje wszystkie elementy w klasie CSS. Zastępuje tylko te, które zostały zmienione. Rzeczywisty styl kontrolki jest kombinacją stylu CSS i niestandardowego stylu w atrybucie stylu. Aby całkowicie powrócić do stylu CSS, wystarczy usunąć atrybut stylu.

$('#foo').removeAttr('style'); 

EDIT:

Widocznie powyżej nie działa. Byłem poinformowała w komentarzach, że następuje jednak robi:

$('#foo').writeAttr('style', ''); 
+1

nie działa, ale $ ('foo') writeAttribute ('styl',''); Prace! Dzięki!! –

+1

Podczas gdy przykład w pytaniu wydaje się wskazywać, że używa się ** prototypejs **, wydaje się, że odpowiedź używa ** jQuery **. A atrybut '' 'writeAttribute''' całkowicie usuwa atrybut' '' style'''' z DOM-Node, podczas gdy inne odpowiedzi usuwają tylko niektóre ustawienia z niego. – heiglandreas

0

można usunąć atrybut, ale nie sądzę, można przywrócić go z powrotem.

Możesz go przywrócić, jeśli do zmiany układu używałeś dodatkowego arkusza stylów. W ten sposób powinieneś być w stanie włączyć arkusz stylów, aby pokazać zmianę, i wyłączyć ją, aby ją cofnąć.

Najlepszym rozwiązaniem będzie prawdopodobnie do przechowywania starych atrybutów do tablicy i używać tej tablicy, aby zmienić swój styl atrybuty powrotem

coś takiego:

var tempStyle = new Array(); 

    function moveFoo(newpostop, newposleft){ 
     tempStyle ["foo"] = new Array(); 
     tempStyle ["foo"]["top"] = newpostop; 
     tempStyle ["foo"]["left"] = newposleft; 

     $('foo').setStyle({top: newpostop+'px', left: newposleft+'px'}); 
    } 

    function restoreFoo(){ 
     $('foo').setStyle({top: tempStyle ["foo"]["top"]+'px', left: tempStyle ["foo"]["left"]+'px'}); 
    } 
6

Ustawianie stylu z null -następnie działa z rozbrajaniem w prototype.js

Możesz także użyć $('foo').setStyle({top:null,left:null}), aby przywrócić wprowadzone zmiany.

1

Można użyć polecenia zwykły Javascript za to na mnie działa bez zarzutu.

$('foo').removeAttribute('style'); 

Usunie cały style = "" element

Powiązane problemy