Difference between revisions of "Team:SYSU-MEDICINE"

Line 278: Line 278:
 
             width: 70px;
 
             width: 70px;
 
             height: 70px;
 
             height: 70px;
 +
 
         }
 
         }
 
         .index-content .img-container .my-icon>img{
 
         .index-content .img-container .my-icon>img{
 +
            position: absolute;
 
             width: 100%;
 
             width: 100%;
 
             height: 100%;
 
             height: 100%;
 +
            z-index:2;
 +
        }
 +
        .index-content .img-container .my-icon>img:hover{
 +
            cursor: pointer;
 +
        }
 +
        .index-content .img-container .my-card{
 +
            position: relative;
 +
            display: none;
 +
            width: 500px;
 +
            top: 25px;
 +
            left: 30px;
 +
            z-index: 1;
 +
        }
 +
        .index-content .img-container .my-card>img{
 +
            width: 100%;
 +
            z-index: 1;
 
         }
 
         }
  
Line 288: Line 306:
 
             top: 100px;
 
             top: 100px;
 
         }
 
         }
 +
 
     </style>
 
     </style>
 
     <script type="text/javascript">
 
     <script type="text/javascript">
Line 327: Line 346:
 
             $(".dropdown").mouseleave(function() {
 
             $(".dropdown").mouseleave(function() {
 
                 $(this).removeClass("open");
 
                 $(this).removeClass("open");
 +
            });
 +
//            card display
 +
//            var containerTop = $(".img-container").offset().top;
 +
//            var containerLeft= $(".img-container").offset().left;
 +
//            for (var i = 1; i <= 1; ++i) {
 +
//                var icon = $("#icon-" + i),
 +
//                        card = $("#card-" + i),
 +
//                        left,
 +
//                        top;
 +
//                if (typeof icon === "undefined") continue;
 +
//                left = icon.offset().left + icon.width() - containerLeft;
 +
//                top = icon.offset().top - containerTop;
 +
//                console.log("left: "+left+" top: "+top);
 +
//                card.css("left", left);
 +
//                card.css("top", top);
 +
//            }
 +
            $(".my-icon").mouseenter(function() {
 +
                var id = $(this).attr("id");
 +
                var num = id.split("-")[1];
 +
                $("#card-"+num).css("display", "block");
 +
            });
 +
            $(".my-icon").mouseleave(function() {
 +
                var id = $(this).attr("id");
 +
                var num = id.split("-")[1];
 +
                $("#card-"+num).css("display", "none");
 
             });
 
             });
 
         });
 
         });
Line 485: Line 529:
 
         <div class="my-icon" id="icon-1">
 
         <div class="my-icon" id="icon-1">
 
             <img src="https://static.igem.org/mediawiki/2016/7/72/T--SYSU-MEDICINE--home-Button1.png">
 
             <img src="https://static.igem.org/mediawiki/2016/7/72/T--SYSU-MEDICINE--home-Button1.png">
 +
            <div class="my-card" id="card-1">
 +
                <img src="https://static.igem.org/mediawiki/2016/6/68/T--SYSU-MEDICINE--home-Card1.png">
 +
            </div>
 +
 
         </div>
 
         </div>
 +
 
     </div>
 
     </div>
 
</div>
 
</div>

Revision as of 16:35, 12 October 2016

MSCavalry

-----MSCs of
next generation

Inflammatory diseases are an increasing cause of disability and even fatality. Currently, apart from common treatments, MSCs therapy is a promising candidate for curing inflammatory diseases. However, intravascular injected MSCs are criticized for its low homing efficiency and ambiguous distribution in human body.

This year, MSCavalry: MSCs of next generation is coming. SYSU-MEDICINE decide to engineer a set of MSCs (homo sapiens) with higher accuracy and we hope that our project can pave the way for future MSCs clinical application.