Fx.Slide의 인스턴스를 만들 때 MooTools가 여백을 제거하는 이유는 무엇입니까?

Question

CSS 규칙이 margin: 0 auto; 인 <div>을 가지고 있으며 필요시 MooTools를 사용하여 슬라이드합니다.

Fx.Slide 개체의 단순한 인스턴스 내 요소의 여백을 제거 것으로 보인다. 즉, 요소가 부모 내부에 가운데에 맞춰졌지만 이제는 왼쪽으로 정렬됩니다.

이

var slide = new Fx.Slide('mydiv'); 

나는이 같은 수행하여이 효과를 상쇄 할 수 있습니다 : 그냥 혼자 선은이 작업을 수행 할 것으로 보인다

var slide = new Fx.Slide('mydiv'); 
$('mydiv').setStyle('margin', '0 auto'); 

을하지만이 조잡하고 난 분명이 일을하고 싶지 않아 이 상황을 겪을 때마다 그리고 더 많은 것을 알고 싶습니다. 왜 MooTools가 먼저 여백을 제거합니까? 내가 모르는 매개 변수가 있습니까? 제가 MooTools를 처음 접했을 때 알려주세요. 그 응용 프로그램이 jQuery의 응용 프로그램보다 훨씬 더 빠르다는 것을 빨리 알게되었지만 (필자의 목적으로는) 필자는 설명서가 구문보다 훨씬 덜 장황 함을 발견했다. Fx.Slide.js에서

Answer 1

:

Fx.Slide = new Class({ 

    /* .. */ 

    initialize: function(element, options){ 
     this.addEvent('complete', function(){ 
      this.open = (this.wrapper['offset' + this.layout.capitalize()] != 0); 
      if (this.open && Browser.Engine.webkit419) this.element.dispose().inject(this.wrapper); 
     }, true); 
     this.element = this.subject = document.id(element); 
     this.parent(options); 
     var wrapper = this.element.retrieve('wrapper'); 
     this.wrapper = wrapper || new Element('div', { 
      styles: $extend(this.element.getStyles('margin', 'position'), {overflow: 'hidden'}) 
     }).wraps(this.element); 
     this.element.store('wrapper', this.wrapper).setStyle('margin', 0); 
     this.now = []; 
     this.open = true; 
    }, 

    /* .. */ 

당신이 볼 수 있듯이, Fx.Slide는 overflow: hidden와 래퍼 DIV (this.wrapper)에서 그것을 감싸고 요소의 margin 및 position, 당신이 그것에 적용되는 요소 (this.element)을한다 요소의 margin을 제거합니다.

는 그래서 margin을 제거하는 디자인입니다. 내가 이해하지 못하는 이유는 여백이 래퍼로 전송되지 않는 이유입니다. !important을 사용하는 부모 요소에 일반 DIV를 수정하는 CSS가있을 수 있으며 Fx.Slide이 속성을 제대로 전송하지 못하게 할 수 있습니다.

당신은 Mootools의 최신 버전 더 (1.2.3.1)과 1.2.3을 Mootools의를 사용하고 있습니까?

또한 Fx.Slide이 제대로 작동하려면 페이지에이 표준 모드 여야합니다. 마크 업에서 가장 먼저 XHTML 또는 HTML (엄격 또는 과도기) doctype을 사용하고 있습니까? (XML 프롤로그 없음).

$('mydiv').getParent().setStyle('margin', '0 auto'); 

MooTools이 작업에 큰 자바 스크립트 프레임 워크와 나는 개인적으로 it is way more powerful than jQuery (jQuery를 거대한 커뮤니티를 가지고 있다는 사실을 제외) 느낌 : 그것은 여전히 ​​작동하지 않으면 최악의 경우는, 다음을 사용합니다. 아쉽게도 More 패키지 (jQuery의 플러그인과 동일) 일관성은 일부 측면에서는 다소 부족합니다.