spin.js,ruby上使用例子
<div id="spinBody">
<div>
<% form_tag "/login", :id => "login_form" do -%>
<table width="100%" cellpadding="3" style="margin-top:15px;">
<tr>
<th style="width: 80px;"><%= t "a.loginid" %></th>
<td><%= text_field_tag 'login',"" %><!--login--></td>
</tr>
<tr>
<td colspan="2" height="50" valign="bottom" >
<%= submit_tag "", :id => "b_login", :onclick => "submitForm();"%>
</td>
</tr>
</table>
<%end -%>
</div>
function submitForm(){
jq("#b_login").attr("disabled", "disabled");
showSpin();
jq("#login_form").submit();
};
function showSpin(){
var spinnerOpts = {
lines: 13, // The number of lines to draw
length: 20, // The length of each line
width: 10, // The line thickness
radius: 30, // The radius of the inner circle
corners: 1, // Corner roundness (0..1)
rotate: 0, // The rotation offset
direction: 1, // 1: clockwise, -1: counterclockwise
color: '#000', // #rgb or #rrggbb or array of colors
speed: 1, // Rounds per second
trail: 60, // Afterglow percentage
shadow: false, // Whether to render a shadow
hwaccel: false, // Whether to use hardware acceleration
className: 'spinner', // The CSS class to assign to the spinner
zIndex: 2e9, // The z-index (defaults to 2000000000)
top: '100', // Top position relative to parent in px
left: 'auto' // Left position relative to parent in px
};
var spinTarget = document.getElementById('spinBody');
new Spinner(spinnerOpts).spin(spinTarget);
};
