Programming4us
         
 
 
Programming

Coding JavaScript for Mobile Browsers (part 9) - Scripting Styles

1/15/2011 4:11:42 PM

4. Scripting Styles

Changing content with JavaScript is useful, but sometimes it’s easier to use styles from JavaScript to make things appear and disappear and change their appearance.

4.1. Changing styles

With DOM support, we can read and dynamically change every inner CSS style using style and its subproperties, like backgroundColor, textAlign, and margin. We can also change CSS styles using the className property of every element. Table 20 explores which browsers support changing the class, removing the class, and applying multiple classes using a space (e.g., class1 class2).

Table 20. Changing CSS dynamically compatibility table
Browser/platformSupport for changing styles and classes dynamically
SafariYes
Android browserYes
Symbian/S60Yes
Nokia Series 40No before 6th edition
webOSYes
BlackBerryNo before 4.6
NetFrontYes
Internet ExplorerYes
Motorola Internet BrowserPartial
Opera MobileYes
Opera MiniYes

4.2. Showing and hiding styles

Table 21 shows which browsers support showing and hiding block content using element.style.display='none' or element.style.display='block'. We can also use style.visibility, but in this case the block will still occupy the box without showing its contents.

Table 21. Showing and hiding elements compatibility table
Browser/platformSupport for showing/hiding content
SafariYes
Android browserYes
Symbian/S60Yes
Nokia Series 40No before 6th edition
webOSYes
BlackBerryNo before 4.6
NetFrontYes
Internet ExplorerYes
Motorola Internet BrowserNo
Opera MobileYes
Opera MiniYes

Other -----------------
- iPad SDK : Preparing Dudel for a New Tool (part 1) - Setting Up the GUI
- iPad SDK : The Structure of Core Text
- iPad SDK : PDF Generation
- jQuery 1.3 : Sorting and paging (part 5) - Finessing the sort keys
- jQuery 1.3 : Sorting and paging (part 4)
- jQuery 1.3 : Sorting and paging (part 3) - Using a comparator to sort table rows
- jQuery 1.3 : Sorting and paging (part 2) - JavaScript sorting
- jQuery 1.3 : Sorting and paging (part 1) - Server-side sorting
- Programming the Mobile Web : JavaScript Mobile - Supported Technologies
- Security in Cloud Computing (part 4) - Audit and Compliance
- Security in Cloud Computing (part 3)
- Security in Cloud Computing (part 2) - Identity and Access Management
- Security in Cloud Computing (part 1) - Data Security and Storage
- Cloud Security and Privacy : Analyst Predictions
- CSS for Mobile Browsers : WebKit Extensions (part 2) - Border Image
- CSS for Mobile Browsers : WebKit Extensions (part 1) - Text Stroke and Fill
- jQuery 1.3 : Working with numeric form data (part 9) - The finished code
- jQuery 1.3 : Working with numeric form data (part 8) - Editing shipping information
- jQuery 1.3 : Working with numeric form data (part 7) - Deleting items
- jQuery 1.3 : Working with numeric form data (part 6) - Finishing touches
 
 
Most View
- Installing Windows Server 2012 and Server Core : Managing and Configuring a Server Core Installation
- Windows 7 : Protecting Yourself Against Email Viruses
- Windows 8 : Configuring Network Connections (part 1) - Configuring Static IP Addresses, Configuring Multiple Gateways
- Introducing Windows Small Business Server 2011: Why Use Windows SBS 2011?
- SharePoint 2010 : Create a New Survey
- Windows Azure : Access Control Service Usage Scenarios (part 2)
- Windows Server 2003 Security Configuration (part 1) - Windows Server 2003 Security Settings
- Windows Phone 7: An Introduction to Touch - Routed Events
- Navigating the Central Administration Home Page (part 2)
- Windows Server 2008 : Configuring SMTP (part 4) - Securing Access to an SMTP Virtual Server
Top 10
- Implementing Edge Services for an Exchange Server 2007 Environment : Utilizing the Basic Sender and Recipient Connection Filters (part 3) - Configuring Recipient Filtering
- Implementing Edge Services for an Exchange Server 2007 Environment : Utilizing the Basic Sender and Recipient Connection Filters (part 2)
- Implementing Edge Services for an Exchange Server 2007 Environment : Utilizing the Basic Sender and Recipient Connection Filters (part 1)
- Implementing Edge Services for an Exchange Server 2007 Environment : Installing and Configuring the Edge Transport Server Components
- What's New in SharePoint 2013 (part 7) - BCS
- What's New in SharePoint 2013 (part 6) - SEARCH
- What's New in SharePoint 2013 (part 6) - WEB CONTENT MANAGEMENT
- What's New in SharePoint 2013 (part 5) - ENTERPRISE CONTENT MANAGEMENT
- What's New in SharePoint 2013 (part 4) - WORKFLOWS
- What's New in SharePoint 2013 (part 3) - REMOTE EVENTS