Modify background of a button onclick event

[former_member219865]

hi everybody,

I have a problem with the theme blue crystal and the element button.

When i press the button it change the background of the button to blue, only when do the action, after y have a button.setclass("x") so it just mudify the colour when do the action.

anyone knows how hide this effect? i try with that

#button:active {

    vertical-align: top;

    padding: 8px 13px 6px;

    background-color:black !important;

}

thanks

[Former Member · Accepted solution]

Hi Gallego,

Could you explain your problem with more details??

Also let me know your desired output

Thanks

Kavya

[former_member219865 · Accepted solution]

i want to delete this effect on the background. you see it changes to blue only just when press the button. after it back to grey. i dont know where to change this effect.

[former_member110741 · Accepted solution]

Hi Jesus gallego,

goto onclick of the button event

comment these lines likke below

//BUTTON1_1.setCSS(ddd");

Subhash

[former_member219865 · Accepted solution]

this is not work for me, because the background only changes at the moment to press the button, what you say keep the css before do the action. but i say only at the moment of the action.

[Former Member · Accepted solution]

Hi Gallego,

Use the below code in the css file of your application:

.btn.sapUiBtnAct.sapUiBtnS:hover

{background-color: #f0f0f0;}

Map the CSS class to btn in properties panel of the element button as below:

On doing the above steps the background changes from blue to default color.

Thanks,

Kavya

[former_member219865 · Accepted solution]

what you say works for hover properties, i try to explain crearly. i want to change the background on the click property not hover

maybe works

.btn.sapUiBtnAct.sapUiBtnS:click

{background-color: #f0f0f0;}

[former_member219865 · Accepted solution]

ok, its works now, i just must to change your code hover for active

.btn.sapUiBtnAct.sapUiBtnS:active

{background-color: #f0f0f0;}

then i apply

button1.setCSS("css" + "btn")

many thanks

[Former Member]

.unselect_button

{

color: #FFFFFF;

font-size: 11px;

font-weight:bold;

text-align:center;

Background-color:#4f81bd;

border: 2px solid #385d8a;

border-radius: 15px 15px 15px 15px;

}

.selected_button

{

color: #FFFFFF;

font-size: 11px;

font-weight:bold;

text-align:center;

Background-color:#1f4061;

border:2px solid #385d8a;

border-radius: 15px 15px 15px 15px;

}

if (txtName=="TEXT_A")

{

TEXT_A.setCSSClass("selected_button");

TEXT_B.setCSSClass("unselect_button");

}

else if  (txtName=="TEXT_B")

{

TEXT_A.setCSSClass("unselect_button");

TEXT_B.setCSSClass("selected_button");

}

[former_member219865]

this option doesn´t work because the because the css I said applies only when you click it then assigns another css, it just at the moment. you know what i mean?

thanks