Button demo: Replace anchors with more appropriate buttons

This commit is contained in:
Jörn Zaefferer 2014-04-24 19:39:08 +02:00
parent e5008c2de1
commit 7d0ca5e37d
8 changed files with 8 additions and 15 deletions

View File

@ -17,7 +17,6 @@
$(function() {
$( "#button" ).click(function() {
$( "#effect" ).addClass( "newClass", 1000, callback );
return false;
});
function callback() {
@ -36,7 +35,7 @@
</div>
</div>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>This demo adds a class which animates: text-indent, letter-spacing, width, height, padding, margin, and font-size.</p>

View File

@ -46,7 +46,7 @@
</div>
</div>
<a href="#" id="button" class="ui-state-default ui-corner-all">Toggle Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Toggle Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>

View File

@ -54,7 +54,6 @@
// set effect from select menu value
$( "#button" ).click(function() {
runEffect();
return false;
});
});
</script>
@ -86,7 +85,7 @@
<option value="slide">Slide</option>
</select>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>

View File

@ -17,7 +17,6 @@
$(function() {
$( "#button" ).click(function() {
$( "#effect" ).removeClass( "newClass", 1000, callback );
return false;
});
function callback() {
@ -36,7 +35,7 @@
</div>
</div>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>

View File

@ -54,7 +54,6 @@
// set effect from select menu value
$( "#button" ).click(function() {
runEffect();
return false;
});
$( "#effect" ).hide();
@ -88,7 +87,7 @@
<option value="slide">Slide</option>
</select>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>

View File

@ -19,7 +19,6 @@
$( "#button" ).click(function(){
$( ".newClass" ).switchClass( "newClass", "anotherNewClass", 1000 );
$( ".anotherNewClass" ).switchClass( "anotherNewClass", "newClass", 1000 );
return false;
});
});
</script>
@ -31,7 +30,7 @@
Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede.
</div>
</div>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>

View File

@ -62,7 +62,6 @@
// set effect from select menu value
$( "#button" ).click(function() {
runEffect();
return false;
});
});
</script>
@ -94,7 +93,7 @@
<option value="slide">Slide</option>
</select>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>

View File

@ -17,7 +17,6 @@
$(function() {
$( "#button" ).click(function() {
$( "#effect" ).toggleClass( "newClass", 1000 );
return false;
});
});
</script>
@ -30,7 +29,7 @@
</div>
</div>
<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>
<div class="demo-description">
<p>Click the button above to preview the effect.</p>