Skip to content
Permalink
Browse files

Widget demo: Add a button to change the color of the widget.

  • Loading branch information
scottgonzalez committed Jul 20, 2011
1 parent e2a9b0c commit 51ee3be39829e339c8e4bccb532347944e600ca5
Showing with 22 additions and 4 deletions.
  1. +22 −4 demos/widget/default.html
@@ -6,15 +6,23 @@
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
<script src="../../jquery-1.5.1.js"></script>
<script src="../../ui/jquery.ui.core.js"></script>
<script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.position.js"></script>
<script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.button.js"></script>
<link rel="stylesheet" href="../demos.css">
<style>
.custom-colorize {
font-size: 25px;
font-size: 20px;
position: relative;
width: 75px;
height: 75px;
}
.custom-colorize-changer {
font-size: 10px;
position: absolute;
right: 0;
bottom: 0;
}
</style>
<script>
$(function() {
@@ -40,8 +48,15 @@
// prevent double click to select text
.disableSelection();

// bind click events to random method
this._bind({
this.changer = $( "<button>", {
text: "change",
className: "custom-colorize-changer"
})
.appendTo( this.element )
.button();

// bind click events on the changer button to the random method
this._bind( this.changer, {
// _bind won't call random when widget is disabled
click: "random"
});
@@ -78,6 +93,9 @@
// events bound via _bind are removed automatically
// revert other modifications here
_destroy: function() {
// remove generated elements
this.changer.remove();

this.element
.removeClass( "custom-colorize" )
.enableSelection()

0 comments on commit 51ee3be

Please sign in to comment.
You can’t perform that action at this time.