Python matplotlibを使って学ぶ統計処理 正規分布 新しいページはコチラ
提供: yonewiki
(→■アニメーションマーカー) |
(→■アニメーションマーカー) |
||
| 344行: | 344行: | ||
<script> | <script> | ||
$(window).scroll(function (){ | $(window).scroll(function (){ | ||
| − | $(".marker- | + | $(".marker-animation").each(function(){ |
var position = $(this).offset().top; //ページの一番上から要素までの距離を取得 | var position = $(this).offset().top; //ページの一番上から要素までの距離を取得 | ||
var scroll = $(window).scrollTop(); //スクロールの位置を取得 | var scroll = $(window).scrollTop(); //スクロールの位置を取得 | ||
| 357行: | 357行: | ||
<syntaxhighlight lang="css"> | <syntaxhighlight lang="css"> | ||
<style type= "text/css"> | <style type= "text/css"> | ||
| − | .marker- | + | .marker-animation.active{ |
background-size: 100% 100%; | background-size: 100% 100%; | ||
background-position: 0px 100%; | background-position: 0px 100%; | ||
} | } | ||
| − | .marker- | + | .marker-animation { |
| − | background-image: -webkit-linear-gradient(bottom, transparent 50%, # | + | background-image: -webkit-linear-gradient(bottom, transparent 50%, #ff7f7f 50%); |
| − | background-image: -moz-linear-gradient(bottom, transparent 50%, # | + | background-image: -moz-linear-gradient(bottom, transparent 50%, #ff7f7f 50%); |
| − | background-image: -ms-linear-gradient(bottom, transparent 50%, # | + | background-image: -ms-linear-gradient(bottom, transparent 50%, #ff7f7f 50%); |
| − | background-image: -o-linear-gradient(bottom, transparent 50%, # | + | background-image: -o-linear-gradient(bottom, transparent 50%, #ff7f7f 50%); |
| − | background-image: linear-gradient(to bottom, transparent 50%, # | + | background-image: linear-gradient(to bottom, transparent 50%, #ff7f7f 50%); |
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-size: 0% 100%; | background-size: 0% 100%; | ||
| 412行: | 412行: | ||
.marker-animation5 { | .marker-animation5 { | ||
| − | background-image: -webkit-linear-gradient(bottom, transparent 45%, # | + | background-image: -webkit-linear-gradient(bottom, transparent 45%, #ff7f7f 50%); |
| − | background-image: -moz-linear-gradient(bottom, transparent 45%, # | + | background-image: -moz-linear-gradient(bottom, transparent 45%, #ff7f7f 50%); |
| − | background-image: -ms-linear-gradient(bottom, transparent 45%, # | + | background-image: -ms-linear-gradient(bottom, transparent 45%, #ff7f7f 50%); |
| − | background-image: -o-linear-gradient(bottom, transparent 45%, # | + | background-image: -o-linear-gradient(bottom, transparent 45%, #ff7f7f 50%); |
| − | background-image: linear-gradient(to bottom, transparent 45%, # | + | background-image: linear-gradient(to bottom, transparent 45%, #ff7f7f 50%); |
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-size: 0% 100%; | background-size: 0% 100%; | ||
