Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

function with css code for active button

CSS

  • Please log in to reply
3 replies to this topic

#1 newphpcoder

newphpcoder

    CC Devotee

  • Senior Member
  • PipPipPipPipPipPip
  • 527 posts

Posted 13 March 2012 - 04:03 PM

Hi..

I don't know if my idea is possible and if how can I do that.

I have functions for button onclick.

I have 3 buttons and I want to change the color of my button if it is active

here is my code
<script type="text/javascript">
//=========display parameter settings==========//
function display_PS(){
    document.loading_kanban.action="ParameterSettings.php";
    document.loading_kanban.submit();
}
//=======display kanban=========//
function display_Kanban(){
    document.loading_kanban.action="kanban_report.php";
    document.loading_kanban.submit();
}
//=========display SR==========//
function display_SR){
    document.loading_kanban.action="StockRequisition.php";
    document.loading_kanban.submit();
}
</script>
<div id="main_button">
<input type="button" name="parameter_settings" value="Parameter Settings" onclick="display_PS()">
<input type="button" name="parameter_settings" value="Stock Requisition" onclick="display_SR()"> 
<input type="button" name="parameter_settings" value="Kanban Report" onclick="display_Kanban()">
</div>

Is it possible to add code in my function for css active button..If no what should I do to change the color of my button for the client to know what page she is.

Thank you
  • 0

#2 RhetoricalRuvim

RhetoricalRuvim

    JavaScript Programmer

  • Expert Member
  • PipPipPipPipPipPipPip
  • 1310 posts
  • Location:C:\Countries\US
  • Programming Language:C, Java, C++, PHP, Python, JavaScript

Posted 21 March 2012 - 07:57 PM

What do you mean by "active?" If you mean that the element has the keyboard focus, try the <object>.onfocus and <object>.onblur properties, where <object> is the element object (if you're accessing the element from JavaScript; the attribute names are the same in HTML (<div onfocus="...">...</div>)), they should work in all major browsers.

If you're talking about changing the color, itself, of the button, then you can try playing around with <object>.style.color and <object>.style.background (or style="color: ...; background: ...;" , if you prefer that better, but you'll probably find the JavaScript version more useful if you want dynamic content), which should set the text color and the button "surface" color, respectively.
  • 0
Regards,
RR

#3 wim DC

wim DC

    Roar

  • Expert Member
  • PipPipPipPipPipPipPipPip
  • 2681 posts
  • Programming Language:Java, JavaScript, PL/SQL
  • Learning:Python

Posted 23 March 2012 - 03:06 AM

Highlighting the current page in some kind of a menu is usually done at the server, not with javascript.
  • 0

#4 RhetoricalRuvim

RhetoricalRuvim

    JavaScript Programmer

  • Expert Member
  • PipPipPipPipPipPipPip
  • 1310 posts
  • Location:C:\Countries\US
  • Programming Language:C, Java, C++, PHP, Python, JavaScript

Posted 23 March 2012 - 09:13 AM

Highlighting the current page in some kind of a menu is usually done at the server, not with javascript.


Is it possible to add code in my function for css active button..


Well he asked about adding code to his function, and he provided JavaScript code, so I am implying that he's talking about adding code to his JavaScript.


But if he was to do it with server-side, he would probably use the style attribute (for buttons), which is also very easy if you know what attributes to set and what values to use; or he could make a drop-down menu with the SELECTED attribute present on the option that needs to be selected on start.
  • 0
Regards,
RR





Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download