modal init
This commit is contained in:
yanxd
parent
045b55236f
commit
3fad5abb5c
|
|
@ -4,7 +4,6 @@
|
|||
暂无作业！
|
||||
<% else %>
|
||||
<% bids.each do |bid|%>
|
||||
|
||||
<table class="content-text-list">
|
||||
<tr><td colspan="2" valign="top" width="50" ><%= link_to(image_tag(url_to_avatar(bid.author), :class => 'avatar'), user_path(bid.author), :class => "avatar") %></td>
|
||||
<td>
|
||||
|
|
@ -15,6 +14,7 @@
|
|||
<span><%= link_to(bid.name, respond_path(bid), :class => 'bid_path') %></span>
|
||||
<span style="float: right">
|
||||
<%# 提交作业按钮，上传文件的作业直接显示上传框，关联项目的作业跳转到新页面 %>
|
||||
<%= link_to "模态窗口", '#OpenWindow', rel: 'leanModal', onclick: "showSubH(#{bid.id});" if Rails.env.development? %>
|
||||
<%= link_to l(:label_commit_homework), 'javascript:void(0);', onclick: "$('#bid-submit-homework-#{bid.id}').toggle();" if bid.homework_type==Bid::HomeworkFile %>
|
||||
<%= link_to(l(:label_commit_homework), respond_path(bid), :class => 'bid_path', target: "_blank") if bid.homework_type==Bid::HomeworkProject %>
|
||||
<% if (User.current.admin?||User.current.id==bid.author_id) %>
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@
|
|||
<%= stylesheet_link_tag 'jquery/jquery-ui-1.9.2', 'application', 'nyan', :media => 'all' %>
|
||||
<%= stylesheet_link_tag 'rtl', :media => 'all' if l(:direction) == 'rtl' %>
|
||||
<%= javascript_heads %>
|
||||
<%= javascript_include_tag "jquery.leanModal.min" %>
|
||||
<%= heads_for_theme %>
|
||||
<%= call_hook :view_layouts_base_html_head %>
|
||||
<!-- page specific tags -->
|
||||
|
|
|
|||
|
|
@ -9,4 +9,46 @@
|
|||
<%= render :partial => 'bids/bid_homework_show', :locals => {:bids => @bids, :bid_pages => @bid_pages} %>
|
||||
</div>
|
||||
|
||||
<a href="#OpenWindow" rel='leanModal'> 打开窗口 </a>
|
||||
<div id="OpenWindow">
|
||||
<div id="signup-ct">
|
||||
<div id="OpenWindow-header">
|
||||
<h2> 上传作业 </h2>
|
||||
<p>
|
||||
It's simple, and free.</p>
|
||||
<a href="#" class="modal_close"></a>
|
||||
</div>
|
||||
<form action="">
|
||||
<div class="txt-fld">
|
||||
<label for="">
|
||||
Username</label>
|
||||
<input type="text" name="" class="good_input" id="" />
|
||||
</div>
|
||||
<div class="txt-fld">
|
||||
<label for="">
|
||||
Email address</label>
|
||||
<input type="text" name="" id="" />
|
||||
</div>
|
||||
<div class="txt-fld">
|
||||
<label for="">
|
||||
Password</label>
|
||||
<input type="text" name="" id="" />
|
||||
</div>
|
||||
<div class="btn-fld">
|
||||
<button type="submit">
|
||||
Sign Up »</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$("a[rel*=leanModal]").leanModal({
|
||||
top:100,
|
||||
closeButton: ".modal_close"
|
||||
});
|
||||
|
||||
function showSubH(id){
|
||||
console.log(id);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 188 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 425 B |
|
|
@ -0,0 +1,5 @@
|
|||
// leanModal v1.1 by Ray Stone - http://finelysliced.com.au
|
||||
// Dual licensed under the MIT and GPL
|
||||
|
||||
(function($){$.fn.extend({leanModal:function(options){var defaults={top:100,overlay:0.5,closeButton:null};var overlay=$("<div id='lean_overlay'></div>");$("body").append(overlay);options=$.extend(defaults,options);return this.each(function(){var o=options;$(this).click(function(e){var modal_id=$(this).attr("href");$("#lean_overlay").click(function(){close_modal(modal_id)});$(o.closeButton).click(function(){close_modal(modal_id)});var modal_height=$(modal_id).outerHeight();var modal_width=$(modal_id).outerWidth();
|
||||
$("#lean_overlay").css({"display":"block",opacity:0});$("#lean_overlay").fadeTo(200,o.overlay);$(modal_id).css({"display":"block","position":"fixed","opacity":0,"z-index":11000,"left":50+"%","margin-left":-(modal_width/2)+"px","top":o.top+"px"});$(modal_id).fadeTo(200,1);e.preventDefault()})});function close_modal(modal_id){$("#lean_overlay").fadeOut(200);$(modal_id).css({"display":"none"})}}})})(jQuery);
|
||||
|
|
@ -66,6 +66,110 @@
|
|||
font-family: Helvetica, Tahoma, Arial, "Microsoft YaHei", "微软雅黑", SimSun, "宋体", STXihei, "华文细黑", Heiti, "黑体", sans-serif;
|
||||
}
|
||||
|
||||
/* 模态窗口
|
||||
*******************************************************************************/
|
||||
|
||||
#lean_overlay{
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: #000;
|
||||
display: none;
|
||||
}
|
||||
#OpenWindow{
|
||||
background: none repeat scroll 0 0 #ffffff;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 4px rgba(0,0,0,0.7);
|
||||
display: none;
|
||||
padding-bottom: 2px;
|
||||
width: 404px;
|
||||
z-index: 11000;
|
||||
left: 50%;
|
||||
margin-left: -202px;
|
||||
opacity: 1;
|
||||
position: fixed;
|
||||
top: 200px;
|
||||
}
|
||||
#OpenWindow {
|
||||
background: none repeat scroll 0 0 #FFFFFF;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
box-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
|
||||
display: none;
|
||||
padding-bottom: 2px;
|
||||
width: 404px;
|
||||
z-index: 11000;
|
||||
left: 50%;
|
||||
margin-left: -202px;
|
||||
opacity: 1;
|
||||
position: fixed;
|
||||
top: 200px;
|
||||
}
|
||||
#OpenWindow-header {
|
||||
background: url("/images/showmodal/hd-bg.png") repeat scroll 0 0 transparent;
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
padding: 18px 18px 14px;
|
||||
}
|
||||
.modal_close {
|
||||
background: url("/images/showmodal/modal_close.png") repeat scroll 0 0 transparent;
|
||||
display: block;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
top: 12px;
|
||||
width: 14px;
|
||||
z-index: 2;
|
||||
}
|
||||
body {
|
||||
/*font-size: 13px;*/
|
||||
}
|
||||
#OpenWindow .txt-fld {
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
padding: 14px 20px;
|
||||
position: relative;
|
||||
text-align: right;
|
||||
width: 364px;
|
||||
}
|
||||
#OpenWindow .txt-fld input {
|
||||
background: none repeat scroll 0 0 #F7F7F7;
|
||||
border-color: #CCCCCC #E7E6E6 #E7E6E6 #CCCCCC;
|
||||
border-radius: 4px 4px 4px 4px;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
color: #222222;
|
||||
font-family: "Helvetica Neue";
|
||||
font-size: 1.2em;
|
||||
outline: medium none;
|
||||
padding: 8px;
|
||||
width: 244px;
|
||||
}
|
||||
#OpenWindow .txt-fld input.good_input {
|
||||
background: url("/images/showmodal/good.png") no-repeat scroll 236px center #DEF5E1;
|
||||
}
|
||||
#OpenWindow .btn-fld {
|
||||
overflow: hidden;
|
||||
padding: 12px 20px 12px 130px;
|
||||
width: 254px;
|
||||
}
|
||||
button {
|
||||
background: none repeat scroll 0 0 #3F9D4A;
|
||||
border: medium none;
|
||||
border-radius: 4px 4px 4px 4px;
|
||||
color: #FFFFFF;
|
||||
float: right;
|
||||
font-family: Verdana;
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
overflow: visible;
|
||||
padding: 7px 10px;
|
||||
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
|
||||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
/* 按钮
|
||||
*******************************************************************************/
|
||||
|
|
|
|||
Loading…
Reference in New Issue