Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

126 lines (111 sloc) 3.072 kb
<style>
#foo, #foo2 {
width: 350px;
min-height: 100px;
border: 1px solid black;
background-color: #aaa;
margin-bottom: 10px;
}
#foo3 {
width: 350px;
height: 200px;
overflow: auto;
border: 1px solid black;
background-color: #aaa;
margin-bottom: 10px;
}
#foo3_content {
height: 600px;
}
input, select, embed {
margin: 10px;
clear:both;
}
#actions {
float: right;
}
</style>
<link rel="stylesheet" type="text/css" media="screen" name="no name" charset="utf-8" href="/asset/more/spinner.css">
<div id="foo">
<input type="text" value="this is a text input">
<select>
<option>one</option>
<option>two</option>
<option>three</option>
<option>four</option>
</select>
<object width="320" height="220">
<param name="movie" value="UserTests/Interface/mediaplayer.swf">
<param name="wmode" value="transparent">
<embed id="mediaplayer" width="320" height="220" flashvars="width=320&height=220&file=/asset/more/video.flv" allowfullscreen="true" quality="high" name="mediaplayer" style="" src="/asset/more/mediaplayer.swf" type="application/x-shockwave-flash" wmode="transparent"/>
</embed>
</object>
</div>
<div id="foo2">
This content will be replaced w/ ajax
</div>
<div id="foo3">
<div id="foo3_content">spinner positioned on a container with overflow:auto and scrollbar offsets</div>
</div>
<script src="/depender/build?require=Core/Request.HTML,More/Spinner,Core/Element.Event"></script>
<script>
makeActions([
{
title: "Test Spinner",
description: "Creates a semi-transparent layer that obscures an element and has a 'spinning' icon and message ovelaid upon that.",
fn: function(){
$('foo').spin({message: 'testing....'});
}
}, {
title: "Tests Spinner start and stop",
description: "Shows and Hides a Spinner",
fn: function(){
var w = $('foo').get('spinner');
w.hide();
w.show();
w.hide.delay(2000, w);
}
}, {
title: "Toggle a Spinner",
description: "Toggles the Spinner's visibility",
fn: function(){
var w = $('foo').get('spinner');
w.hide();
w.toggle();
w.toggle.delay(2000, w);
}
}, {
title: "Spinner with Request",
description: "Retrieves content via ajax and automatically applies the Spinner to it.",
fn: function(){
var req = new Request.HTML({
url: '/ajax_html_echo/?html=<p>This+was+fetched+via+AJAX</p>',
spinnerOptions: {
message: 'testing....'
},
method: 'get',
useSpinner: true,
update: $('foo2')
});
req.send();
}
}, {
title: "Spinner with Request (Element.load)",
description: "Retrieves content via ajax and automatically applies the Spinner to it.",
fn: function(){
$('foo2').set('html', 'This content will be replaced w/ ajax').set('load', {
url: '/ajax_html_echo/?html=<p>This+was+fetched+via+AJAX</p>',
method: 'get',
useSpinner: true
}).load();
}
}, {
title: "Spinner with Scroll Offsets",
description: "Positions Spinner correctly based on scroll offsets",
fn: function(){
$('foo3').scrollTo(0,300);
$('foo3').spin({message: 'testing....'});
}
}
]);
</script>
Jump to Line
Something went wrong with that request. Please try again.