This control of jquery is used for changing opacity of a web control.This works in two situation.
- Case : Opacity High If opacity of webcontrol is high then it decrease it's opacity to zero
- Case : Opacity Low If opacity of webcontrol is low then it increase it's opacity to maximum.
Situation
We have some text that becomes visible (if opacity Low) or becomes invisible (if opacity High) when user click on a button .
Solution
- First identify source who generate event(above situation mouse click)
- Secon identify target on which we want to apply this effect.
- Use jquery showhide.js for implementing this task
- use jquery http://www.programmingduniya.com/common/jquery/showhide.js
$("#target_id").fadeToggle(
time-to-animate
);
Points
- we can give time in numeric form ex 100 or 1000
- Standard string form "slow","fast"
<html>
<head>
<style>
span { background-color:green;color:white;padding:10px;font-size:15px; }
</style>
<script src="http://www.programmingduniya.com/common/jquery/showhide.js">
</script>
</head>
<body>
<button id="btnclick2">See Magic</button>
<span id="hide1">On or Off effect</span>
<script>
$("#btnclick2").click(function () {
$("#hide1").fadeToggle(3000);
});
</script>
</body>
</html>
No comments:
Post a Comment