library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Position demo: Address todo comment by replacing plugin methods

Browse Source
This commit is contained in:
Jörn Zaefferer 2014-04-24 12:15:51 +02:00
parent 62c9a9c3ec
commit 16f421fd50
1 changed files with 21 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
demos/position/cycler.html
View File

@ -25,52 +25,51 @@
</style>
<script>
$(function() {
// TODO refactor into a widget and get rid of these plugin methods
$.fn.left = function( using ) {
return this.position({
function left( element, using ) {
element.position({
my: "right middle",
at: "left+25 middle",
of: "#container",
collision: "none",
using: using
});
};
$.fn.right = function( using ) {
return this.position({
}
function right( element, using ) {
element.position({
my: "left middle",
at: "right-25 middle",
of: "#container",
collision: "none",
using: using
});
};
$.fn.center = function( using ) {
return this.position({
}
function center( element, using ) {
element.position({
my: "center middle",
at: "center middle",
of: "#container",
using: using
});
};
}
$( "img:eq(0)" ).left();
$( "img:eq(1)" ).center();
$( "img:eq(2)" ).right();
left( $( "img:eq(0)" ) );
center( $( "img:eq(1)" ) );
right( $( "img:eq(2)" ) );
function animate( to ) {
$( this ).stop( true, false ).animate( to );
}
function next( event ) {
event.preventDefault();
$( "img:eq(2)" ).center( animate );
$( "img:eq(1)" ).left( animate );
$( "img:eq(0)" ).right().appendTo( "#container" );
center( $( "img:eq(2)" ), animate );
left( $( "img:eq(1)" ), animate );
right( $( "img:eq(0)" ).appendTo( "#container" ) );
}
function previous( event ) {
event.preventDefault();
$( "img:eq(0)" ).center( animate );
$( "img:eq(1)" ).right( animate );
$( "img:eq(2)" ).left().prependTo( "#container" );
center( $( "img:eq(0)" ), animate );
right( $( "img:eq(1)" ), animate );
left( $( "img:eq(2)" ).prependTo( "#container" ) );
}
$( "#previous" ).click( previous );
$( "#next" ).click( next );
@ -80,9 +79,9 @@
});
$( window ).resize(function() {
$( "img:eq(0)" ).left( animate );
$( "img:eq(1)" ).center( animate );
$( "img:eq(2)" ).right( animate );
left( $( "img:eq(0)" ), animate );
center( $( "img:eq(1)" ), animate );
right( $( "img:eq(2)" ), animate );
});
});
</script>