jacknudt
/
socialforge
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

用户图像样式

This commit is contained in:
huang 2016-03-29 18:25:16 +08:00
parent 2728cccd41
commit 65e80b1978
3 changed files with 103 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

159
app/views/layouts/base_org_newstyle.html.erb
View File

@ -29,85 +29,102 @@
</script>
<script type="text/javascript">
window.onload = function () {
var oBtnLeft = document.getElementById("goleft");
var oBtnRight = document.getElementById("goright");
var oDiv = document.getElementById("indexmaindiv");
var oDiv1 = document.getElementById("maindiv1");
var oUl = oDiv.getElementsByTagName("ul")[0];
var aLi = oUl.getElementsByTagName("li");
var now = -5 * (aLi[0].offsetWidth + 13);
oUl.style.width = aLi.length * (aLi[0].offsetWidth + 13) + 'px';
oBtnRight.onclick = function () {
var n = Math.floor((aLi.length * (aLi[0].offsetWidth + 13) + oUl.offsetLeft) / aLi[0].offsetWidth);
$("#navHomepageProfile").mouseenter(function(){
$("#homepageProfileMenuIcon").addClass("homepageProfileMenuIconhover");
$("#topnav_login_list").show();
});
$("#navHomepageProfile").mouseleave(function(){
$("#homepageProfileMenuIcon").removeClass("homepageProfileMenuIconhover");
$("#topnav_login_list").hide();
});
if (n <= 5) {
move(oUl, 'left', 0);
}
else {
move(oUl, 'left', oUl.offsetLeft + now);
}
}
oBtnLeft.onclick = function () {
var now1 = -Math.floor((aLi.length / 5)) * 5 * (aLi[0].offsetWidth + 13);
if (oUl.offsetLeft >= 0) {
move(oUl, 'left', now1);
}
else {
move(oUl, 'left', oUl.offsetLeft - now);
}
}
var timer = setInterval(oBtnRight.onclick, 5000);
oDiv.onmouseover = function () {
clearInterval(timer);
}
oDiv.onmouseout = function () {
timer = setInterval(oBtnRight.onclick, 5000);
}
};
function getStyle(obj, name) {
if (obj.currentStyle) {
return obj.currentStyle[name];
}
else {
return getComputedStyle(obj, false)[name];
}
}
function move(obj, attr, iTarget) {
clearInterval(obj.timer)
obj.timer = setInterval(function () {
var cur = 0;
if (attr == 'opacity') {
cur = Math.round(parseFloat(getStyle(obj, attr)) * 100);
}
else {
cur = parseInt(getStyle(obj, attr));
}
var speed = (iTarget - cur) / 6;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
if (iTarget == cur) {
clearInterval(obj.timer);
}
else if (attr == 'opacity') {
obj.style.filter = 'alpha(opacity:' + (cur + speed) + ')';
obj.style.opacity = (cur + speed) / 100;
}
else {
obj.style[attr] = cur + speed + 'px';
}
}, 30);
function signout(){
$.post(
'<%= signout_path%>',
{}
);
}
</script>
</head>
<!--add by huang-->
<body onload="prettyPrint();">
<div class="cl"></div>
<div class="container">
<div class="header">
<div class="header-con">
<a href="index.html" class="fl logo"><img src="/images/org_new_style/logo.jpg" alt=""/></a>
<%# 登录 %>
<% if User.current.logged? %>
<div class="navHomepageProfile" id="navHomepageProfile">
<ul>
<li class="homepageProfileMenuIcon fr" id="homepageProfileMenuIcon">
<%= link_to "<div class='mt5 mb8 user-img' id='user_avatar'>#{image_tag(url_to_avatar(User.current), :class => "portraitRadius",:alt=>"头像", :id => "nh_user_logo")}</div>".html_safe,user_activities_path(User.current.id)%>
<%#= link_to image_tag(url_to_avatar(User.current)), user_url_in_org(User.current.id), :alt => '用户头像', :target => '_blank', :class => "fr user-img" %>
<ul class="topnav_login_list none" id="topnav_login_list">
<li>
<%= link_to "修改资料", my_account_path, :class => "menuGrey"%>
</li>
<li>
<%= link_to "我的组织", user_organizations_user_path(:id => User.current.id), :class => "menuGrey"%>
</li>
<li>
<%= link_to "新建组织", new_organization_path, :class => "menuGrey"%>
</li>
<!--<li><a href="javascript:void(0);" class="menuGrey">账号设置</a> </li>-->
<li>
<%= link_to "退出",logout_url_without_domain,:class => "menuGrey",:method => "post"%>
</li>
</ul>
</li>
</ul>
</div>
<!--<li class="navOrgMenu fr" id="orgUser" style="cursor:pointer;">-->
<%#= link_to image_tag(url_to_avatar(User.current)), user_url_in_org(User.current.id), :alt => '用户头像', :target => '_blank', :class => "fr user-img" %>
<%#= link_to User.current, user_url_in_org(User.current.id),:id => "orgUserName",:class => 'fontGrey2 f14 mr5',:target => '_blank' %>
<%#= link_to "退出",logout_url_without_domain, :class =>"menuGrey", :method => 'post', :rel => "nofollow" %>
<!--</li>-->
<!--<li class="navOrgMenu fr"><%#=link_to User.current, user_path(User.current), :class => "linkGrey8 f14" %></li>-->
<% else %>
<li class="navOrgMenu fr"><a href="<%= signin_url_without_domain %>" class="login fr"></a></li>
<li class="navOrgMenu fr"><a href="<%= register_url_without_domain %>" class="register fr"></a></li>
<% end %>
<!--<a href="#" class="fr user-img" ><img src="/images/org_new_style/detailimg4.jpg" /></a>-->
</div>
<div class="cl"></div>
</div><!--header end-->
<div class="nav-box">
<div class="nav fl">
<% @subfield_content.each do |field| %>
<% if is_default_field?(field) %>
<% case field.name %>
<% when 'activity' %>
<%= link_to "首页", organization_path(@organization), :class => "fl navact" %>
<% when 'course' %>
<a href="#course_<%= field.id %>" class="fl"> 课程动态</a>
<% when 'project' %>
<a href="#project_<%= field.id %>" class="fl">项目动态</a>
<% end %>
<% else %>
<% if field.field_type == "Post" && field.hide == 0 %>
<a href="#message_<%= field.id %>" class="fl"><%= field.name %></a>
<% elsif field.field_type == "Resource" && field.hide == 0%>
<a href="#resource_<%= field.id %>" class="fl"><%= field.name %></a>
<% end %>
<% end %>
<% end %>
</div>
</div><!--nav end-->
<div class="banner">
<h2><%= @organization.name %></h2>
<p>ＣＮＳＳ<br><span>open laboratory of simulation and testing</span></p>
</div>
<div class="header">
<div class="header-con">
<a href="index.html" class="fl"><%= image_tag(url_to_avatar(@organization),width:"60", height: "60", :id=>'nh_user_tx') %><img src="/images/org_new_style/logo.jpg" alt=""/></a>

BIN
public/images/org_new_style/banner.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 48 KiB

53
public/stylesheets/org_new_style.css
View File

@ -1,6 +1,5 @@
@charset "utf-8";
/* CSS Document */
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{ margin:0; padding:0;}
body,table,input,textarea,select,button { font-family: "微软雅黑","宋体"; font-size:12px;line-height:1.5; background:#fff;}
div,img,tr,td,table{ border:0;}
@ -18,15 +17,16 @@ a:hover{color:#29156f;}
.mb70{ margin-bottom:70px;}
/** header **/
.header{ width:100%; height:72px; background:#29146f; padding:38px 0 40px;}
.header{ width:100%; height:60px; background:#29146f; padding:5px 0 0px; }
.header-con{ width:1200px; margin:0 auto;}
.logo,.logo img{ display:block; height:52px; }
a.login{ background:url(../images/org_new_style/icons.png) -7px -11px no-repeat; width:146px; height:55px; margin-right:40px; margin-top:11px;}
a:hover.login{ background:url(../images/org_new_style/icons.png) -7px -88px no-repeat; }
a.register{ background:url(../images/org_new_style/icons.png) -190px -11px no-repeat; width:158px; height:55px; ;margin-top:11px;}
a:hover.register{ background:url(../images/org_new_style/icons.png) -190px -88px no-repeat; }
/** nav **/
.nav-box{ width:1200px; height:79px; margin:0 auto;}
.nav a{ display:block; padding:25px 10px; font-size:18px; color:#000; margin-right:20px; }
.nav-box{ width:1200px; height:60px; margin:0 auto;}
.nav a{ display:block; padding:15px 10px; font-size:18px; color:#000; margin-right:20px; }
.navact{border-bottom:3px solid #ffbd18;}
.nav a:hover{border-bottom:3px solid #ffbd18;}
.searchbox{ width:338px; height:57px; border:1px solid #ccc; -moz-border-radius: 35px; -webkit-border-radius: 35px; margin:10px 0px 0 0;}
@ -37,40 +37,10 @@ a:hover.search-icon{ background:url(../images/org_new_style/icons.png) -387px -8
.searchbox:hover{ background:#999999; color:#fff;}
/* Header text */
.header-content { background: url(../images/org_new_style/header-background.jpg) no-repeat 50% 0px #070317;margin: 0;padding: 0;float: left;width: 100%;line-height: 22px;position: relative;z-index: 1;}
.header-content.home {height: 609px;}
.home .header-content { background: #070317 ; }
.header-content img {float: left; margin: 0 0 0 15px;}
.header-content .text {width:800px; text-align:center; margin-top:20%; }
.header-content .copy {font-size: 24px; line-height: 70px; }
.header-content .button { margin:0 auto;}
.header-content .dimmed { background: rgba(255, 255, 255, 0.4);}
.header-content .dimmed:hover { background: rgba(255, 255, 255, 1); }
.header-content .align-bottom {position: absolute; bottom: 0px;}
/* => SLIDE PREV AND NEXT ARROWS <= */
.slider-prev,
.slider-next {text-indent:-9999px; width:60px;height:60px;background:url("../images/org_new_style/icons.png") -306px -264px no-repeat; position:absolute;top:50%; margin-top:-19px; z-index:999; opacity:.5;
-webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */-moz-transition: all 0.3s ease-out; /* FF4+ */ -ms-transition: all 0.3s ease-out; /* IE10? */ -o-transition: all 0.3s ease-out; /* Opera 10.5+ */ transition: all 0.3s ease-out;display: none}
.slider-prev{ left:50px; }
.slider-next { right:50px;background-position:-382px -264px;}
.slider-prev:hover,.slider-next:hover{opacity:1;}
/* => SLIDER NAV o o o <= */
.slider-nav {position:absolute;bottom:5px;left:50%;list-style:none; overflow:hidden; padding:2px; z-index:10;margin: 0; }
.slider-nav li{ float:left; }
.slider-nav li a{ display:block;width:13px;height:13px;overflow:hidden; padding:0px; margin:5px; background:url("../images/org_new_style/icons.png") no-repeat -419px -219px; text-decoration:none; text-indent:-999px;}
.slider-nav li a:hover,.slider-nav li a.selected{background-position:-402px -219px;}
/* => HOLY SLIDES <= */
.slider section {display: none;}
.slider section.first {display: block;}
.slider-sections, .slider-sections section {width: 806px; height: 600px; }
.slider-sections {margin: 0 auto; position: relative;}
.slider-sections section {position: absolute; top: 0; left: 0px; }
.header-content h2 {font:400 62px/1.2 "microsoft yahei", Tahoma, arial, sans-serif;color: #fff;margin: 0 0 26px; }
.header-content p {margin: 0 0 30px; font-size:28px; color:#fff;}
.header-content .centered-content{padding-top: 30px;padding-bottom: 10px;}
.button {float: left;width:800px;list-style: none; }
.button a { font-size: 15px;line-height: 18px; text-decoration: none;color:#FFF; padding: 12px 56px;display: block;width: auto;z-index: 2;border: none; -moz-border-radius: 25px;border-radius: 25px;cursor: pointer; margin:0 auto; width:35px;}
.button a:hover{color:#29156f;}
.banner{ width:100%; height:234px; background:#070317 url(../images/org_new_style/banner.jpg) 0 0 no-repeat; color:#fff; text-align:center; padding-top:80px; line-height:2.4;}
.banner h2{ font-size:42px; }
.banner p{ font-size:18px;}
.banner span{ font-size:16px;}
/** box1 **/
.box1{ width:100%; padding:70px 0;}
@ -176,6 +146,13 @@ a.download-btn{ display:block; border:1px solid #ccc; margin-top:10px; font-siz
a:hover.download-btn{ background:#29146f; color:#fff; border:none;}
.user-img img{ border:2px solid #e6473b; margin-right:10px; -moz-border-radius: 50px; -webkit-border-radius: 50px;border-radius: 50px; display:block; width:40px; height:40px;}
.ml60{ margin-left:60px;}
/*用户图像*/
.topnav_login_list{ border:1px solid #eaeaea; background:#fff; padding-left:10px; padding-bottom:10px; padding-top:8px; width:60px; left:-7px; position:absolute; z-index:9999; line-height:2; box-shadow: 0px 2px 8px rgba(146, 153, 169, 0.5); margin-top: 1px;}
.topnav_login_list a{color:#269ac9;}
.topnav_login_list li{ }
.homepageProfileMenuIcon {background:url(../images/nav_icon.png) 30px -155px no-repeat; width:65px; height:54px; position:relative; display:inline-block; line-height:0;}
.homepageLeft {width:240px; float:left; margin-right:10px; margin-bottom:10px;}
.none {display: none;}