IO-Docs Tricks
You can style an IO-Docs method differently when it's expanded than when it's collapsed.
To make it work, you need to use a [JavaScript Event Hook](/docs/read/your_portal/layout_and_design/Event_Hooks) to add a class to the expanded or collapsed method, and some CSS to change the style.
**JavaScript**
```js
// Add active class to method
document.addEventListener('portalIODocsShowMethod', function (event) {
    event.target.closest('.method').classList.add('method-active');
}, false);
// Remove active class from method
document.addEventListener('portalIODocsHideMethod', function (event) {
    event.target.closest('.method').classList.remove('method-active');
}, false);
```
**CSS**
```css
.method {
    /* Base styles */
}
.method.method-active {
    /* Modified styles */
}
```        
        
        
        
            Docs Navigation
- API Documentation Portal
 - IO Docs Definition
 - Mashery API Documentation
- Mashery 3.0 API Guide
 - Mashery 2.0 API Guide
- OAuth Supporting Methods
 - Examples
 - JSON RPC
 - Authentication
 - API Objects
 - Fetching Objects
 - Query Language
 - Creating Objects
 - Updating Objects
 - Validating Fields
 - Deleting Objects
 - Applications
 - General Object Methods
 - Members
 - Packages
 - Plans
 - Package Keys
 - Keys
 - Developer Classes
 - Services
 - Roles
 
 - Mashery 2.0 Reporting API Guide
 - Event Trigger API
 - Differences between Roles and Portal Access Groups
 - Managing a Portal Access Group Using Mashery V2 or V3 API
 
 - Mashery Reporting Event Post API Guide
 - Tips and Tricks
 - Your Portal
 - API Traffic Manager
 - I/O Docs WSDL requirements