Rails＆prototype - 插入div並定位它

對於我的rails站點，當有人試圖刪除某個項目時，我希望在這樣做之前彈出一個自定義div（而不是javascript alert框）以請求確認。Rails＆prototype - 插入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，這也讓我瘋狂。（Ya，我也嘗試過使用螢火蟲，但是那些長長的javascript對我來說毫無意義）> <）

我的update_page塊的第二行意味着調用一個javascript函數， 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被創建，並且在適當的插入到頁面點。然而，它並沒有被放置在任何我能說的地方。所以，我在尋求幫助！我在做什麼錯誤的JavaScript函數，或試圖調用該函數？

在此先感謝！

--edit-- 我不確定這是否有幫助...這是delete_box的相關CSS代碼。

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

所以CSS不以任何方式觸及定位。

來源

2010-07-21 Jty.tan

爲什麼不把定位放在CSS中（使用位置：例如固定）？ – 2010-07-21 07:23:16

'delete_box'需要出現在頁面中間，所以我不需要計算視口的尺寸，然後相應地放置div的'top'和'left'屬性？我不認爲這種計算可以在樣式表中完成。 – 2010-07-21 07:36:17

有幾個預烘製的圖書館可以做你剛剛說的，可能比你自己寫的要容易一些。舉個例子，Redbox是一個在Prototype中工作的rails插件。

來源

2010-07-21 13:29:33 jasonpgignac

嗯... 我可能會這樣做。它剛剛變成了現實（我一直在努力爭取幾天的時間），我真的很想弄清楚爲什麼它不起作用，只是作爲一個學習點。但是，我一定會去看看紅匣子。謝謝！ – 2010-07-21 14:01:38

對，redbox非常易於使用。非常感謝你！：D – 2010-07-21 14:28:10

很高興有用:) – jasonpgignac 2010-07-21 18:41:18

Rails＆prototype - 插入div並定位它

回答

相關問題