레일 및 프로토 타입 - div를 삽입하고 위치를 지정하십시오.

Question

내 레일 사이트의 경우 누군가가 항목을 삭제하려고하면 javascript 알림 상자가 아닌 사용자 정의 div가 나타나기 전에 확인을 요청하고 싶습니다. 순간

, 내가이 일을하고있는 방법으로 아래의 삭제 링크를 클릭하면 ( application_helper.rb에서) 함수를 호출하는 것입니다 :

def show_delete_box(object, name) 
    update_page do |page| 
     page.insert_html :before, "content", render(:partial => "shared/generic_delete_box", :locals => { :object => object, :name => name }) 
     page << "$('delete_box').Center" 
    end 
    end 

렌더링 된면 부분에 표시하기위한 것입니다 화면 중앙에 위치하며 지역 주민은 div에 적절한 삭제 링크를 만드는 데 사용될 것입니다.

그러나 여기 내 문제는 화면 중간에 나타나게하려고하는 것입니다. 나는 항상 javascript로 엄청난 고통을 겪었고 이것은 나를 미치게 만든다. (예, 파이어 버그를 사용하려고했지만 자바 스크립트의 긴 줄은 아무 의미가 없습니다.> <)

내 update_page 블록의 두 번째 줄은 삽입 된 가운데에있는 자바 스크립트 함수를 호출하기위한 것입니다. div.

다음과 같이 내 application.js 파일에 기록하고 붙어 한 기능은 다음과 같습니다 내가 클릭 할 때 발생

Element.Center = function(element) { 
    var vH, vW, eH, eW; 
    var d = Element.getDimensions(element); 
    eH = d.height; 
    eW = d.width; 
    vH = document.viewport.getHeight(); 
    vW = document.viewport.getWidth(); 

    var y = (vH/2) - (eH/2) + "px"; 
    var x = (vW/2) - (eW/2) + "px"; 
    var style = { position: 'absolute'; top: y + 'px'; left: x + 'px'}; 

    element.setStyle(style); 
} 

, 부분 DIV 생성하고 해당의 페이지에 삽입되어 있다는 것입니다 자리. 그러나 어쨌든 내가 말할 수있는 위치에 있지 않습니다. 그래서, 나는 도움을 찾고있다! 자바 스크립트 함수에서 무엇을 잘못하거나 함수를 호출하려고합니까?

미리 감사드립니다.

--edit-- 이것이 도움이되는지 확실하지 않습니다 ... delete_box에 대한 관련 CSS 코드입니다.

#delete_box { 
    background-color: green; 
    border: 5px solid #999; 
    padding: 15px; 
    width: 600px; 
} 

그래서 CSS는 어떤 식 으로든 위치 지정을 건드리지 않습니다.

Answer 1

당신이 말한 것을 수행하는 몇 가지 미리 굽는 라이브러리가 있습니다. 직접 쓰는 것보다 더 쉬울 수도 있습니다. Redbox는 Prototype에서 작동하는 레일즈 플러그인입니다.