Team:UCLondon/Templates/Team-Style
From 2012e.igem.org
(Difference between revisions)
(32 intermediate revisions not shown) | |||
Line 14: | Line 14: | ||
<div id="fuzz" style="display:none;"></div> | <div id="fuzz" style="display:none;"></div> | ||
- | <div id=" | + | <div id="shadowTeam" style="display:none;" > |
- | <div id="close- | + | <div id="close-boxTeam" style="background:url(http://db.tt/N9CUKlnO) no-repeat 0 0; height:35px; width:35px; cursor:pointer;"></div> |
- | <div id="box- | + | <div id="box-contentTeam" style="width:95%; height:95%; margin:auto;"> |
- | <div id=" | + | <div id="loadTeam" style="background:url(http://db.tt/UTRvh0fQ) no-repeat center center; height:100px; width:100px; margin:auto;"></div> |
</div> | </div> | ||
</div> | </div> | ||
Line 50: | Line 50: | ||
.team .description { display:none; } | .team .description { display:none; } | ||
- | # | + | .team .attribution { display:none; } |
+ | |||
+ | #shadowTeam { | ||
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from( rgba(255, 255, 255, 1) ), to( rgb(249, 249, 249) ) ); | background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from( rgba(255, 255, 255, 1) ), to( rgb(249, 249, 249) ) ); | ||
Line 65: | Line 67: | ||
position:fixed; | position:fixed; | ||
height: 400px; | height: 400px; | ||
- | width: | + | width:600px; |
margin:auto; | margin:auto; | ||
z-index: 2; | z-index: 2; | ||
Line 112: | Line 114: | ||
} | } | ||
- | |||
- | |||
- | |||
target.children('ul').html( str ); | target.children('ul').html( str ); | ||
Line 124: | Line 123: | ||
- | var | + | var openTeamBox = function () { |
- | $('# | + | $('#shadowTeam').center(); |
var description = $(this).children().children('.description'); | var description = $(this).children().children('.description'); | ||
- | var input = "<div style='float:left; width:40%; margin:auto; color:rgb(117, 117, 117) !important; text-align:center;'>" + $(this).children().children('a').html() + $(this).children().children('.position').html() + "</div>"; | + | var input = "<div style='float:left; width:40%; margin:auto; color:rgb(117, 117, 117) !important; text-align:center;'>" + $(this).children().children('a').html() + $(this).children().children('.position').html() + "</div>"; |
- | input += "<div style='overflow:auto; width:58%; height:90%; float:right;'><p>"+ description.html() + "</p></div>"; | + | input += "<div style='overflow:auto; width:58%; height:90%; float:right; text-align:justify;'><p style='padding-right:13px;'>"+ description.html() + "</p>"; |
+ | |||
+ | if ($(this).children().children('.attribution').html() != undefined){ | ||
+ | |||
+ | input += "<br/><div style='color:rgb(117, 117, 117);'> Attributions:</div>" + "<div style='text-align:left; padding-left:0px; padding-right:0px; font-size:9pt; color:rgb(117, 117, 117);'>" + $(this).children().children('.attribution').html() + "</div>"; | ||
+ | |||
+ | } | ||
+ | |||
+ | input += "</div>"; | ||
- | $('# | + | $('#shadowTeam').toggle('slow', function() { |
- | $(this).children('#box- | + | $(this).children('#box-contentTeam').html(input); |
- | $('#box- | + | $('#box-contentTeam img').css({ 'width':180, 'height':140}); |
}); | }); | ||
Line 143: | Line 150: | ||
- | var | + | var closeTeamBox = function() { |
- | $('# | + | $('#shadowTeam').toggle('slow', function() { |
- | $(this).children('#box- | + | $(this).children('#box-contentTeam').html(loading); |
}); | }); | ||
} | } | ||
Line 154: | Line 161: | ||
loading = $('#load').parent().html(); | loading = $('#load').parent().html(); | ||
- | $('body').off('click', '.team li', | + | $('body').off('click', '.team li', openTeamBox); |
- | $('body').on('click', '.team li', | + | $('body').on('click', '.team li', openTeamBox); |
- | $('body').off('click', '#close- | + | $('body').off('click', '#close-boxTeam', closeTeamBox); |
- | $('body').on('click', '#close- | + | $('body').on('click', '#close-boxTeam', closeTeamBox); |
}); | }); |
Latest revision as of 01:56, 28 October 2012