Difference between revisions of "Template:HSiTAIWAN"

Line 143: Line 143:
 
     border:2px solid #86680c;
 
     border:2px solid #86680c;
 
}
 
}
 +
  
 
#Drherb{
 
#Drherb{
 
     min-height:200px;
 
     min-height:200px;
 
     min-width:187px;
 
     min-width:187px;
−
     background: url('https://static.igem.org/mediawiki/2016/3/3b/T--HSiTAIWAN--DrHerbQ.gif') no-repeat;
+
     background: url('https://static.igem.org/mediawiki/2016/b/b8/T--HSiTAIWAN--DrHerbQA.gif') no-repeat;
 
     background-size:contain;
 
     background-size:contain;
 
}
 
}
 +
 +
#dialog>p{
 +
    width:100%;
 +
}
 +
#convopen{
 +
    position: absolute;
 +
    margin-left: 100px;
 +
    width: 50px;
 +
    background-color: rgba(177, 243, 243, 0.7);
 +
    box-shadow: 1px 1px 4px rgba(0,0,0,0.6);
 +
    border-radius: 10px;
 +
    text-align: center;
 +
    font-weight: 900;
 +
    line-height: 30px;
 +
    display:none;
 +
    cursor:pointer;
 +
}
 +
#convblank{
 +
    position: absolute;
 +
    margin-left: 100px;
 +
    margin-top: -50px;
 +
}
 +
#qnaNextBt,#qnaPrevBt{
 +
    height: 25px;
 +
    width: 70px;
 +
    font-size: 18px;
 +
    text-align: center;
 +
    line-height: 25px;
 +
    border: 1px solid;
 +
    border-radius: 8px;
 +
    float: right;
 +
    margin-top: -30px;
 +
    box-shadow: 0px 0px 3px;
 +
    cursor: pointer;
 +
}
 +
#qnaNextBt{
 +
    margin-right: 3px;
 +
}
 +
#qnaPrevBt{
 +
    margin-right: 80px;
 +
}
 +
#qnaClose{
 +
    position: relative;
 +
    float: right;
 +
    right: 10px;
 +
    top: 5px;
 +
    border-radius: 7px;
 +
    background-color: rgba(0, 92, 255, 0.5);
 +
    width: 20px;
 +
    cursor: pointer;
 +
    text-align: center;
 +
    font-weight: 900;
 +
    border: solid 1px;
 +
}
 +
 +
#dialog{
 +
    width: 250px;
 +
    background-color: rgba(177, 243, 243, 0.7);
 +
    box-shadow: 1px 1px 4px rgba(0,0,0,0.6);
 +
    border-radius: 10px;
 +
    padding: 20px 6px 30px 6px;
 +
    cursor:text;
 +
}
 +
 +
 +
 
</style>
 
</style>
  
Line 262: Line 329:
 
<div class="bot" style="position:fixed;bottom:5px;left:5px;">
 
<div class="bot" style="position:fixed;bottom:5px;left:5px;">
  
−
<div class="drag" id="Drherb" style="bottom:5px;left:5px;">
+
  <div class="drag" id="Drherb" style="bottom:5px;left:5px;">
  
−
</div>
+
    <div id='convblank'>
 +
      <div id='qnaClose'>X</div>
 +
      <div id='dialog'></div>
 +
      <div id='qnaNextBt'>Next ⇒</div>
 +
      <div id='qnaPrevBt'>⇐ Prev</div>
 +
    </div>
 +
    <div id='convopen'>...</div>
 +
         
 +
  </div>
  
 
</div>
 
</div>
Line 270: Line 345:
  
 
<script type="text/javascript">
 
<script type="text/javascript">
 +
 
function setimg(x)
 
function setimg(x)
 
{
 
{
 
document.getElementById(x).style.background.image="url('')"
 
document.getElementById(x).style.background.image="url('')"
 
}
 
}
 +
 +
 +
var DrherbFunction=function(){
 +
var dialog=$('#dialog');
 +
var qnaNextBt=$('#qnaNextBt');
 +
    var qnaPrevBt=$('#qnaPrevBt');
 +
    var closeBt=$('#qnaClose');
 +
    var openBt=$('#convopen');
 +
 +
        closeBt.click(function(){
 +
                dialog.css({'display':'none'});
 +
                qnaNextBt.css({'display':'none'});
 +
                qnaPrevBt.css({'display':'none'});
 +
                closeBt.css({'display':'none'});
 +
                openBt.css({'display':'block'});
 +
        });
 +
        openBt.click(function(){
 +
                dialog.css({'display':'block'});
 +
                qnaNextBt.css({'display':'block'});
 +
                qnaPrevBt.css({'display':'block'});
 +
                closeBt.css({'display':'block'});
 +
                openBt.css({'display':'none'});
 +
        });
 +
 +
};
 +
 
</script>
 
</script>
  

Revision as of 08:06, 23 November 2016

X
Next ⇒
⇐ Prev
...