Make content active upon select

Are you able to make oth开发者_如何学JAVAer content active or visible upon selecting another item, similar to that of the apple iphone webpage - when you select the iphone 4 colour the model version becomes fully visible and active.

Apple iPhone Page How would you go about making this work in jquery?

---

You can bind a click event handler to an element, and do whatever you like in there:

document.getElementById("someElem").onclick = function() {
    document.getElementById("anotherElem").style.display = "block";
}

You can see above that I've used the the style property, which can be used to change the CSS properties of the element (in this case, I'm changing the display property to block - if it was hidden before then this would make anotherElem become visible).

To do that in jQuery:

$("#someElem").click(function() {
    $("#anotherElem").show(); //Or use .css to change other CSS properties
});

---

The opacity CSS property is used to "disable" the element. opacity takes a value between zero and one - Choosing a value close to zero results in not-so-visible content.

In JQuery, you can achieve this effect by using:

$("$myElement").css("opacity", "0.5");

At the apple page, the effect is emphasized by adding borders (where they previously didn't exist).