Setting Styles with JavaScript

Introduction

Setting Style with JS
Introduction
Setting Visibility
Setting Style
Getting Style
ClassName Swap
Summary

Usage of functions to get and set CSS values. Beginner to intermediate JavaScript.

getElementById method
Accessing the style attribute and its properties
parameter passing
Reading styles

I will show you the basic idea of how to access and change styles. After that, I will show you a smart function that changes any style for any object.

How to access an object's visibility style property:

var obj= document.getElementById(obj);
obj.style.visibility = "visible";

Many CSS style names use a hyphen. So how do you identify a hyphenated style such as background-color? The "-" character is omitted, and the character following it is capitalized. In CSS you use: background-color, font-size, border-width but in JavaScript, you use backgroundColor, fontSize, and borderWidth.

Object has no properties error

Make sure you call document.getElementById(myDiv) after the page has loaded. You can do this with a body onload handler. Otherwise, you will get an error and the script will not work. The reason this happens is that the script is trying to access an element in the page before the page is loaded. Since the element is not yet loaded, JavaScript can't find it.

AnimTree

Tabs

GlideMenus

DragLib

Setting Styles with JavaScript

Introduction

Setting Style with JS

Object has no properties error

Tags

Archived Scripts