2013-03-04 103 views
2

我有一個html <button>並按照基金會<p:commandButton>對其進行了設計。但我沒有得到懸停和積極的影響。我曾嘗試使用javascript onmouse添加效果,但仍無法獲得它。如何將primefaces按鈕懸停效果添加到html按鈕

<button type="submit" id="submit" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" onmouseover="$(this).addClass('ui-state-hover')" onmouseout="$(this).removeClass('ui-state-hover')" onmousedown="$(this).addClass('ui-state-active')"> 
     <h:outputText styleClass="ui-button-text" value="Login" /> 
</button> 

我該如何做到這一點?

+0

試圖通過jQuery/JavaScript或CSS只是要添加這個功能嗎?你的jquery/javascript代碼在哪裏? – Swarne27 2013-03-05 05:23:47

+0

我正在使用Primefaces組件庫,它有自己的內置css和j-query庫。這些功能已經內置在庫中,所以當我使用時,我可以獲得完整的效果。但是,我需要在HTML按鈕上使用這些樣式。我無法理解 – fareed 2013-03-05 05:39:35

+0

適合我。 – BalusC 2013-03-13 19:03:13

回答

1

添加onmouseup後,它對我的​​項目有效;

<input jsfc="h:commandButton" 
    class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only yourCSSClass" 
    onmouseover="$(this).addClass('ui-state-hover')" 
    onmouseout="$(this).removeClass('ui-state-hover')" 
    onmousedown="$(this).addClass('ui-state-active')" 
    onmouseup="$(this).removeClass('ui-state-active')" 
    value="New Button" onclick="alert('Hello World!');"> 
    <f:ajax execute="@form" render="@none" /> 
</input>