Difference between revisions of "Team:BGU Israel"
| Line 1: | Line 1: | ||
| − | |||
| − | |||
<html lang="en"> | <html lang="en"> | ||
<head> | <head> | ||
| − | + | ||
| − | <title> | + | <title>OriginALS</title> |
<meta charset="utf-8"> | <meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1"> | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| + | <link type="text/css" rel="stylesheet" href="style.css"> | ||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> | ||
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css"> | <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css"> | ||
| Line 14: | Line 13: | ||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> | <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> | ||
<style> | <style> | ||
| − | + | body { | |
| − | font: 400 15px | + | font: 400 15px Segoe UI, sans-serif; |
line-height: 1.8; | line-height: 1.8; | ||
color: #818181; | color: #818181; | ||
| − | |||
} | } | ||
| − | + | h1 { | |
| − | font-size: | + | font-size: 32px; |
| + | font-family: Segoe UI Light; | ||
text-transform: uppercase; | text-transform: uppercase; | ||
color: #303030; | color: #303030; | ||
| Line 34: | Line 33: | ||
margin-bottom: 30px; | margin-bottom: 30px; | ||
} | } | ||
| + | p, ol { | ||
| + | font-size: 16px; | ||
| + | |||
| + | color:#010101; | ||
| + | } | ||
.jumbotron { | .jumbotron { | ||
background-color: #f4511e; | background-color: #f4511e; | ||
| Line 124: | Line 128: | ||
.navbar { | .navbar { | ||
margin-bottom: 0; | margin-bottom: 0; | ||
| − | background-color: # | + | background-color: #fff; |
z-index: 9999; | z-index: 9999; | ||
border: 0; | border: 0; | ||
| − | + | text-transform:uppercase; | |
| − | + | ||
| − | + | ||
border-radius: 0; | border-radius: 0; | ||
| − | + | font-family: 'Segoe UI Light'; | |
| − | font- | + | font-weight: 600; |
| + | color:#000; | ||
} | } | ||
.navbar li a, .navbar .navbar-brand { | .navbar li a, .navbar .navbar-brand { | ||
| − | color: # | + | color: #000 !important; |
} | } | ||
.navbar-nav li a:hover, .navbar-nav li.active a { | .navbar-nav li a:hover, .navbar-nav li.active a { | ||
| − | color: # | + | color: #0186ac !important; |
background-color: #fff !important; | background-color: #fff !important; | ||
} | } | ||
| Line 145: | Line 148: | ||
color: #fff !important; | color: #fff !important; | ||
} | } | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
.slideanim {visibility:hidden;} | .slideanim {visibility:hidden;} | ||
.slide { | .slide { | ||
| Line 193: | Line 192: | ||
} | } | ||
} | } | ||
| − | </style> | + | header.masthead { |
| + | padding-top: 10rem; | ||
| + | padding-bottom: calc(10rem - 56px); | ||
| + | |||
| + | background-position: center center; | ||
| + | -webkit-background-size: cover; | ||
| + | -moz-background-size: cover; | ||
| + | -o-background-size: cover; | ||
| + | background-size: cover; | ||
| + | } | ||
| + | .parallax-window { | ||
| + | min-height: 700px; | ||
| + | background: transparent; | ||
| + | } | ||
| + | #abstract p, #abstract ol { | ||
| + | text-align: justify; | ||
| + | } | ||
| + | #myBtn { | ||
| + | display: none; | ||
| + | |||
| + | position: fixed; | ||
| + | bottom: 20px; | ||
| + | right: 20px; | ||
| + | z-index: 99; | ||
| + | font-size: 16px; | ||
| + | border: none; | ||
| + | outline: none; | ||
| + | background-color: #0186ac; | ||
| + | color: white; | ||
| + | cursor: pointer; | ||
| + | padding: 8px 15px 8px 15px; | ||
| + | border-radius: 100px; | ||
| + | } | ||
| + | |||
| + | #myBtn:hover { | ||
| + | background-color: #555; | ||
| + | } | ||
| + | footer { | ||
| + | background-color:#262626; | ||
| + | color:#fff !important; | ||
| + | } | ||
| + | </style> | ||
</head> | </head> | ||
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60"> | <body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60"> | ||
| + | <div id="top"></div> | ||
| + | <a id="myBtn" href="#top" title="To Top"> | ||
| + | <span class="glyphicon glyphicon-chevron-up"></span> | ||
| + | </a> | ||
<nav class="navbar navbar-default navbar-fixed-top"> | <nav class="navbar navbar-default navbar-fixed-top"> | ||
| Line 209: | Line 253: | ||
<div class="collapse navbar-collapse" id="myNavbar"> | <div class="collapse navbar-collapse" id="myNavbar"> | ||
<ul class="nav navbar-nav navbar-right"> | <ul class="nav navbar-nav navbar-right"> | ||
| − | <li><a href=" | + | <li><a href="index.html">Home</a></li> |
| − | <li><a href="# | + | <li><a href="#top">Team</a></li> |
| − | <li><a href="#portfolio"> | + | <li><a href="#portfolio">Parts</a></li> |
| − | <li><a href="#pricing"> | + | <li><a href="#pricing">Practices</a></li> |
| − | <li><a href="#contact"> | + | <li><a href="#contact">Arrtibutions</a></li> |
</ul> | </ul> | ||
</div> | </div> | ||
</div> | </div> | ||
</nav> | </nav> | ||
| − | + | <header class="masthead text-center parallax-window text-white d-flex" data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2018/2/2e/T--BGU_Israel--home_banner.jpg"> | |
| − | + | <div class="container my-auto"> | |
| − | + | </div> | |
| − | + | </header> | |
| − | + | ||
| − | + | ||
<!-- Container (About Section) --> | <!-- Container (About Section) --> | ||
| − | <div id=" | + | <div id="abstract" class="container-fluid text-center"> |
<div class="row"> | <div class="row"> | ||
| − | + | <div class="col-sm-8 col-sm-offset-2"> | |
| − | + | <h1>Abstract</h1> | |
| − | < | + | <p style="margin:0px !important; padding:0!important;" class="mb-4 justified animated fadeInRight">Recent research studies of Amyotrophic Lateral Sclerosis (ALS) suggest that brain cells that have become toxic, directly contribute to the progression of the disease. These cells change their gene expression pattern and possess distinguishing genetic markers. In addition, they drive the death of other cells in the brain among them the motor neurons. <br><br> |
| − | + | Our objective, as the BGU-IGEM team OriginALS, is to prolong survival of ALS patients via a novel genetic engineering approach. In order to reach this objective, we combine two separate strategies as our therapeutic approach: </p> | |
| − | + | <ol class="mb-4 justified animated fadeInRight"> | |
| − | + | <li> We identify and selectively eliminate only the toxic cells. In order to identify and target the toxic-cells only, we use distinguishing markers that are unique only to them.</li> | |
| − | + | <li>We prevent the generation of new toxic cells by genetically targeting specific molecules that generate the toxic cells.</li> | |
| − | + | </ol> | |
| − | + | <p class="mb-4 justified animated fadeInRight"> | |
| − | + | In conclusion, our approach combines an apoptotic destruction of toxic cells with the prevention of the formation of new toxic cells, thus aiming to significantly reduce the occurrence of toxic cells in the central neuronal system (CNS), which is aimed at a significant deceleration of the progression rate of ALS.</p> | |
| − | + | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
</div> | </div> | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
</div> | </div> | ||
</div> | </div> | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | + | <div id="contact"></div> | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | <div id="contact | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
<footer class="container-fluid text-center"> | <footer class="container-fluid text-center"> | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
</footer> | </footer> | ||
| Line 481: | Line 297: | ||
$(document).ready(function(){ | $(document).ready(function(){ | ||
// Add smooth scrolling to all links in navbar + footer link | // Add smooth scrolling to all links in navbar + footer link | ||
| − | $(".navbar a, | + | $(".navbar a, #myBtn[href='#top']").on('click', function(event) { |
// Make sure this.hash has a value before overriding default behavior | // Make sure this.hash has a value before overriding default behavior | ||
if (this.hash !== "") { | if (this.hash !== "") { | ||
| Line 494: | Line 310: | ||
$('html, body').animate({ | $('html, body').animate({ | ||
scrollTop: $(hash).offset().top | scrollTop: $(hash).offset().top | ||
| − | }, | + | }, 500, function(){ |
// Add hash (#) to URL when done scrolling (default click behavior) | // Add hash (#) to URL when done scrolling (default click behavior) | ||
| Line 514: | Line 330: | ||
}) | }) | ||
</script> | </script> | ||
| + | <script> | ||
| + | /*! | ||
| + | * parallax.js v1.5.0 (http://pixelcog.github.io/parallax.js/) | ||
| + | * @copyright 2016 PixelCog, Inc. | ||
| + | * @license MIT (https://github.com/pixelcog/parallax.js/blob/master/LICENSE) | ||
| + | */ | ||
| + | ;(function ( $, window, document, undefined ) { | ||
| + | |||
| + | // Polyfill for requestAnimationFrame | ||
| + | // via: https://gist.github.com/paulirish/1579671 | ||
| + | |||
| + | (function() { | ||
| + | var lastTime = 0; | ||
| + | var vendors = ['ms', 'moz', 'webkit', 'o']; | ||
| + | for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { | ||
| + | window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame']; | ||
| + | window.cancelAnimationFrame = window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame']; | ||
| + | } | ||
| + | |||
| + | if (!window.requestAnimationFrame) | ||
| + | window.requestAnimationFrame = function(callback) { | ||
| + | var currTime = new Date().getTime(); | ||
| + | var timeToCall = Math.max(0, 16 - (currTime - lastTime)); | ||
| + | var id = window.setTimeout(function() { callback(currTime + timeToCall); }, | ||
| + | timeToCall); | ||
| + | lastTime = currTime + timeToCall; | ||
| + | return id; | ||
| + | }; | ||
| + | |||
| + | if (!window.cancelAnimationFrame) | ||
| + | window.cancelAnimationFrame = function(id) { | ||
| + | clearTimeout(id); | ||
| + | }; | ||
| + | }()); | ||
| + | |||
| + | |||
| + | // Parallax Constructor | ||
| + | |||
| + | function Parallax(element, options) { | ||
| + | var self = this; | ||
| + | |||
| + | if (typeof options == 'object') { | ||
| + | delete options.refresh; | ||
| + | delete options.render; | ||
| + | $.extend(this, options); | ||
| + | } | ||
| + | |||
| + | this.$element = $(element); | ||
| + | |||
| + | if (!this.imageSrc && this.$element.is('img')) { | ||
| + | this.imageSrc = this.$element.attr('src'); | ||
| + | } | ||
| + | |||
| + | var positions = (this.position + '').toLowerCase().match(/\S+/g) || []; | ||
| + | |||
| + | if (positions.length < 1) { | ||
| + | positions.push('center'); | ||
| + | } | ||
| + | if (positions.length == 1) { | ||
| + | positions.push(positions[0]); | ||
| + | } | ||
| + | |||
| + | if (positions[0] == 'top' || positions[0] == 'bottom' || positions[1] == 'left' || positions[1] == 'right') { | ||
| + | positions = [positions[1], positions[0]]; | ||
| + | } | ||
| + | |||
| + | if (this.positionX !== undefined) positions[0] = this.positionX.toLowerCase(); | ||
| + | if (this.positionY !== undefined) positions[1] = this.positionY.toLowerCase(); | ||
| + | |||
| + | self.positionX = positions[0]; | ||
| + | self.positionY = positions[1]; | ||
| + | |||
| + | if (this.positionX != 'left' && this.positionX != 'right') { | ||
| + | if (isNaN(parseInt(this.positionX))) { | ||
| + | this.positionX = 'center'; | ||
| + | } else { | ||
| + | this.positionX = parseInt(this.positionX); | ||
| + | } | ||
| + | } | ||
| + | |||
| + | if (this.positionY != 'top' && this.positionY != 'bottom') { | ||
| + | if (isNaN(parseInt(this.positionY))) { | ||
| + | this.positionY = 'center'; | ||
| + | } else { | ||
| + | this.positionY = parseInt(this.positionY); | ||
| + | } | ||
| + | } | ||
| + | |||
| + | this.position = | ||
| + | this.positionX + (isNaN(this.positionX)? '' : 'px') + ' ' + | ||
| + | this.positionY + (isNaN(this.positionY)? '' : 'px'); | ||
| + | |||
| + | if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) { | ||
| + | if (this.imageSrc && this.iosFix && !this.$element.is('img')) { | ||
| + | this.$element.css({ | ||
| + | backgroundImage: 'url(' + this.imageSrc + ')', | ||
| + | backgroundSize: 'cover', | ||
| + | backgroundPosition: this.position | ||
| + | }); | ||
| + | } | ||
| + | return this; | ||
| + | } | ||
| + | |||
| + | if (navigator.userAgent.match(/(Android)/)) { | ||
| + | if (this.imageSrc && this.androidFix && !this.$element.is('img')) { | ||
| + | this.$element.css({ | ||
| + | backgroundImage: 'url(' + this.imageSrc + ')', | ||
| + | backgroundSize: 'cover', | ||
| + | backgroundPosition: this.position | ||
| + | }); | ||
| + | } | ||
| + | return this; | ||
| + | } | ||
| + | |||
| + | this.$mirror = $('<div />').prependTo(this.mirrorContainer); | ||
| + | |||
| + | var slider = this.$element.find('>.parallax-slider'); | ||
| + | var sliderExisted = false; | ||
| + | |||
| + | if (slider.length == 0) | ||
| + | this.$slider = $('<img />').prependTo(this.$mirror); | ||
| + | else { | ||
| + | this.$slider = slider.prependTo(this.$mirror) | ||
| + | sliderExisted = true; | ||
| + | } | ||
| + | |||
| + | this.$mirror.addClass('parallax-mirror').css({ | ||
| + | visibility: 'hidden', | ||
| + | zIndex: this.zIndex, | ||
| + | position: 'fixed', | ||
| + | top: 0, | ||
| + | left: 0, | ||
| + | overflow: 'hidden' | ||
| + | }); | ||
| + | |||
| + | this.$slider.addClass('parallax-slider').one('load', function() { | ||
| + | if (!self.naturalHeight || !self.naturalWidth) { | ||
| + | self.naturalHeight = this.naturalHeight || this.height || 1; | ||
| + | self.naturalWidth = this.naturalWidth || this.width || 1; | ||
| + | } | ||
| + | self.aspectRatio = self.naturalWidth / self.naturalHeight; | ||
| + | |||
| + | Parallax.isSetup || Parallax.setup(); | ||
| + | Parallax.sliders.push(self); | ||
| + | Parallax.isFresh = false; | ||
| + | Parallax.requestRender(); | ||
| + | }); | ||
| + | |||
| + | if (!sliderExisted) | ||
| + | this.$slider[0].src = this.imageSrc; | ||
| + | |||
| + | if (this.naturalHeight && this.naturalWidth || this.$slider[0].complete || slider.length > 0) { | ||
| + | this.$slider.trigger('load'); | ||
| + | } | ||
| + | |||
| + | } | ||
| + | |||
| + | |||
| + | // Parallax Instance Methods | ||
| + | |||
| + | $.extend(Parallax.prototype, { | ||
| + | speed: 0.2, | ||
| + | bleed: 0, | ||
| + | zIndex: -100, | ||
| + | iosFix: true, | ||
| + | androidFix: true, | ||
| + | position: 'center', | ||
| + | overScrollFix: false, | ||
| + | mirrorContainer: 'body', | ||
| + | |||
| + | refresh: function() { | ||
| + | this.boxWidth = this.$element.outerWidth(); | ||
| + | this.boxHeight = this.$element.outerHeight() + this.bleed * 2; | ||
| + | this.boxOffsetTop = this.$element.offset().top - this.bleed; | ||
| + | this.boxOffsetLeft = this.$element.offset().left; | ||
| + | this.boxOffsetBottom = this.boxOffsetTop + this.boxHeight; | ||
| + | |||
| + | var winHeight = Parallax.winHeight; | ||
| + | var docHeight = Parallax.docHeight; | ||
| + | var maxOffset = Math.min(this.boxOffsetTop, docHeight - winHeight); | ||
| + | var minOffset = Math.max(this.boxOffsetTop + this.boxHeight - winHeight, 0); | ||
| + | var imageHeightMin = this.boxHeight + (maxOffset - minOffset) * (1 - this.speed) | 0; | ||
| + | var imageOffsetMin = (this.boxOffsetTop - maxOffset) * (1 - this.speed) | 0; | ||
| + | var margin; | ||
| + | |||
| + | if (imageHeightMin * this.aspectRatio >= this.boxWidth) { | ||
| + | this.imageWidth = imageHeightMin * this.aspectRatio | 0; | ||
| + | this.imageHeight = imageHeightMin; | ||
| + | this.offsetBaseTop = imageOffsetMin; | ||
| + | |||
| + | margin = this.imageWidth - this.boxWidth; | ||
| + | |||
| + | if (this.positionX == 'left') { | ||
| + | this.offsetLeft = 0; | ||
| + | } else if (this.positionX == 'right') { | ||
| + | this.offsetLeft = - margin; | ||
| + | } else if (!isNaN(this.positionX)) { | ||
| + | this.offsetLeft = Math.max(this.positionX, - margin); | ||
| + | } else { | ||
| + | this.offsetLeft = - margin / 2 | 0; | ||
| + | } | ||
| + | } else { | ||
| + | this.imageWidth = this.boxWidth; | ||
| + | this.imageHeight = this.boxWidth / this.aspectRatio | 0; | ||
| + | this.offsetLeft = 0; | ||
| + | |||
| + | margin = this.imageHeight - imageHeightMin; | ||
| + | |||
| + | if (this.positionY == 'top') { | ||
| + | this.offsetBaseTop = imageOffsetMin; | ||
| + | } else if (this.positionY == 'bottom') { | ||
| + | this.offsetBaseTop = imageOffsetMin - margin; | ||
| + | } else if (!isNaN(this.positionY)) { | ||
| + | this.offsetBaseTop = imageOffsetMin + Math.max(this.positionY, - margin); | ||
| + | } else { | ||
| + | this.offsetBaseTop = imageOffsetMin - margin / 2 | 0; | ||
| + | } | ||
| + | } | ||
| + | }, | ||
| + | |||
| + | render: function() { | ||
| + | var scrollTop = Parallax.scrollTop; | ||
| + | var scrollLeft = Parallax.scrollLeft; | ||
| + | var overScroll = this.overScrollFix ? Parallax.overScroll : 0; | ||
| + | var scrollBottom = scrollTop + Parallax.winHeight; | ||
| + | |||
| + | if (this.boxOffsetBottom > scrollTop && this.boxOffsetTop <= scrollBottom) { | ||
| + | this.visibility = 'visible'; | ||
| + | this.mirrorTop = this.boxOffsetTop - scrollTop; | ||
| + | this.mirrorLeft = this.boxOffsetLeft - scrollLeft; | ||
| + | this.offsetTop = this.offsetBaseTop - this.mirrorTop * (1 - this.speed); | ||
| + | } else { | ||
| + | this.visibility = 'hidden'; | ||
| + | } | ||
| + | |||
| + | this.$mirror.css({ | ||
| + | transform: 'translate3d('+this.mirrorLeft+'px, '+(this.mirrorTop - overScroll)+'px, 0px)', | ||
| + | visibility: this.visibility, | ||
| + | height: this.boxHeight, | ||
| + | width: this.boxWidth | ||
| + | }); | ||
| + | |||
| + | this.$slider.css({ | ||
| + | transform: 'translate3d('+this.offsetLeft+'px, '+this.offsetTop+'px, 0px)', | ||
| + | position: 'absolute', | ||
| + | height: this.imageHeight, | ||
| + | width: this.imageWidth, | ||
| + | maxWidth: 'none' | ||
| + | }); | ||
| + | } | ||
| + | }); | ||
| + | |||
| + | |||
| + | // Parallax Static Methods | ||
| + | |||
| + | $.extend(Parallax, { | ||
| + | scrollTop: 0, | ||
| + | scrollLeft: 0, | ||
| + | winHeight: 0, | ||
| + | winWidth: 0, | ||
| + | docHeight: 1 << 30, | ||
| + | docWidth: 1 << 30, | ||
| + | sliders: [], | ||
| + | isReady: false, | ||
| + | isFresh: false, | ||
| + | isBusy: false, | ||
| + | |||
| + | setup: function() { | ||
| + | if (this.isReady) return; | ||
| + | |||
| + | var self = this; | ||
| + | |||
| + | var $doc = $(document), $win = $(window); | ||
| + | |||
| + | var loadDimensions = function() { | ||
| + | Parallax.winHeight = $win.height(); | ||
| + | Parallax.winWidth = $win.width(); | ||
| + | Parallax.docHeight = $doc.height(); | ||
| + | Parallax.docWidth = $doc.width(); | ||
| + | }; | ||
| + | |||
| + | var loadScrollPosition = function() { | ||
| + | var winScrollTop = $win.scrollTop(); | ||
| + | var scrollTopMax = Parallax.docHeight - Parallax.winHeight; | ||
| + | var scrollLeftMax = Parallax.docWidth - Parallax.winWidth; | ||
| + | Parallax.scrollTop = Math.max(0, Math.min(scrollTopMax, winScrollTop)); | ||
| + | Parallax.scrollLeft = Math.max(0, Math.min(scrollLeftMax, $win.scrollLeft())); | ||
| + | Parallax.overScroll = Math.max(winScrollTop - scrollTopMax, Math.min(winScrollTop, 0)); | ||
| + | }; | ||
| + | |||
| + | $win.on('resize.px.parallax load.px.parallax', function() { | ||
| + | loadDimensions(); | ||
| + | self.refresh(); | ||
| + | Parallax.isFresh = false; | ||
| + | Parallax.requestRender(); | ||
| + | }) | ||
| + | .on('scroll.px.parallax load.px.parallax', function() { | ||
| + | loadScrollPosition(); | ||
| + | Parallax.requestRender(); | ||
| + | }); | ||
| + | |||
| + | loadDimensions(); | ||
| + | loadScrollPosition(); | ||
| + | |||
| + | this.isReady = true; | ||
| + | |||
| + | var lastPosition = -1; | ||
| + | |||
| + | function frameLoop() { | ||
| + | if (lastPosition == window.pageYOffset) { // Avoid overcalculations | ||
| + | window.requestAnimationFrame(frameLoop); | ||
| + | return false; | ||
| + | } else lastPosition = window.pageYOffset; | ||
| + | |||
| + | self.render(); | ||
| + | window.requestAnimationFrame(frameLoop); | ||
| + | } | ||
| + | |||
| + | frameLoop(); | ||
| + | }, | ||
| + | |||
| + | configure: function(options) { | ||
| + | if (typeof options == 'object') { | ||
| + | delete options.refresh; | ||
| + | delete options.render; | ||
| + | $.extend(this.prototype, options); | ||
| + | } | ||
| + | }, | ||
| + | |||
| + | refresh: function() { | ||
| + | $.each(this.sliders, function(){ this.refresh(); }); | ||
| + | this.isFresh = true; | ||
| + | }, | ||
| + | |||
| + | render: function() { | ||
| + | this.isFresh || this.refresh(); | ||
| + | $.each(this.sliders, function(){ this.render(); }); | ||
| + | }, | ||
| + | |||
| + | requestRender: function() { | ||
| + | var self = this; | ||
| + | self.render(); | ||
| + | self.isBusy = false; | ||
| + | }, | ||
| + | destroy: function(el){ | ||
| + | var i, | ||
| + | parallaxElement = $(el).data('px.parallax'); | ||
| + | parallaxElement.$mirror.remove(); | ||
| + | for(i=0; i < this.sliders.length; i+=1){ | ||
| + | if(this.sliders[i] == parallaxElement){ | ||
| + | this.sliders.splice(i, 1); | ||
| + | } | ||
| + | } | ||
| + | $(el).data('px.parallax', false); | ||
| + | if(this.sliders.length === 0){ | ||
| + | $(window).off('scroll.px.parallax resize.px.parallax load.px.parallax'); | ||
| + | this.isReady = false; | ||
| + | Parallax.isSetup = false; | ||
| + | } | ||
| + | } | ||
| + | }); | ||
| + | |||
| + | |||
| + | // Parallax Plugin Definition | ||
| + | |||
| + | function Plugin(option) { | ||
| + | return this.each(function () { | ||
| + | var $this = $(this); | ||
| + | var options = typeof option == 'object' && option; | ||
| + | |||
| + | if (this == window || this == document || $this.is('body')) { | ||
| + | Parallax.configure(options); | ||
| + | } | ||
| + | else if (!$this.data('px.parallax')) { | ||
| + | options = $.extend({}, $this.data(), options); | ||
| + | $this.data('px.parallax', new Parallax(this, options)); | ||
| + | } | ||
| + | else if (typeof option == 'object') | ||
| + | { | ||
| + | $.extend($this.data('px.parallax'), options); | ||
| + | } | ||
| + | if (typeof option == 'string') { | ||
| + | if(option == 'destroy'){ | ||
| + | Parallax.destroy(this); | ||
| + | }else{ | ||
| + | Parallax[option](); | ||
| + | } | ||
| + | } | ||
| + | }); | ||
| + | } | ||
| + | |||
| + | var old = $.fn.parallax; | ||
| + | |||
| + | $.fn.parallax = Plugin; | ||
| + | $.fn.parallax.Constructor = Parallax; | ||
| + | |||
| + | |||
| + | // Parallax No Conflict | ||
| + | |||
| + | $.fn.parallax.noConflict = function () { | ||
| + | $.fn.parallax = old; | ||
| + | return this; | ||
| + | }; | ||
| + | |||
| + | |||
| + | // Parallax Data-API | ||
| + | |||
| + | $( function () { | ||
| + | $('[data-parallax="scroll"]').parallax(); | ||
| + | }); | ||
| + | |||
| + | }(jQuery, window, document)); | ||
| + | |||
| + | </script> | ||
| + | <script> | ||
| + | // When the user scrolls down 20px from the top of the document, show the button | ||
| + | window.onscroll = function() {scrollFunction()}; | ||
| + | |||
| + | function scrollFunction() { | ||
| + | if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { | ||
| + | document.getElementById("myBtn").style.display = "block"; | ||
| + | } else { | ||
| + | document.getElementById("myBtn").style.display = "none"; | ||
| + | } | ||
| + | } | ||
| + | |||
| + | |||
| + | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
Revision as of 08:38, 29 July 2018
Abstract
Recent research studies of Amyotrophic Lateral Sclerosis (ALS) suggest that brain cells that have become toxic, directly contribute to the progression of the disease. These cells change their gene expression pattern and possess distinguishing genetic markers. In addition, they drive the death of other cells in the brain among them the motor neurons.
Our objective, as the BGU-IGEM team OriginALS, is to prolong survival of ALS patients via a novel genetic engineering approach. In order to reach this objective, we combine two separate strategies as our therapeutic approach:
- We identify and selectively eliminate only the toxic cells. In order to identify and target the toxic-cells only, we use distinguishing markers that are unique only to them.
- We prevent the generation of new toxic cells by genetically targeting specific molecules that generate the toxic cells.
In conclusion, our approach combines an apoptotic destruction of toxic cells with the prevention of the formation of new toxic cells, thus aiming to significantly reduce the occurrence of toxic cells in the central neuronal system (CNS), which is aimed at a significant deceleration of the progression rate of ALS.