2018-01-01から1年間の記事一覧
slick.jsを使用した、プログレスバー付きのスライド html** <html lang="ja"> <head> <meta charset="UTF-8"> <title>プログレスバースライド</title> <script type="text/javascript" src="js/jquery182.js"></script> <script src="https://cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script> </meta></head></html>
chibinowa.net Clippy — CSS clip-path maker
html** <html lang="en"> <head> <meta charset="UTF-8"> <title>ランダム画像表示</title> <link rel="stylesheet" type="text/css" href="css/style.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ // setRamd…</link></meta></head></html>
app.codegrid.net app.codegrid.net
yohshiy.blog.fc2.com
umekov.hatenablog.com qiita.com
qiita.com node.jsのversionを管理するためにnodebrewを利用する
左からスライドして出てくるメニューと常時見えているアコーディオンメニューを作成してみました。 html** <html lang="ja"> <head> <meta charset="UTF-8"> <title>Reflect_header</title> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" type="text/css" href="css/style.css"> </link></meta></meta></head></html>
以下２つのリンクを参考に私なりにアレンジして、複数動画の埋め込み+inview時自動再生を試してみました。参考 埋め込んだYouTubeでFacebookみたいな動画自動再生を実装した話。スクロールで再生するやつ - Qiita 同一ページ内でYouTubeを複数設置したときに…
animate.cssを使用することで、簡単に以下のサイトで紹介されている動きを実現できます！ Animate.css使い方は以下のサイトを参照してください。 bashalog.c-brains.jp html** <html lang="ja"> <head> <meta charset="UTF-8"> <title>Animate.cssでCSSアニメーション</title> <link rel="stylesheet" href="css/animate.css" /> </link></meta></head></html>
参考にしたページ www.dot-st.com 上記ページのスクロールしたらカーテンのようなものが右側にスライドして通過後に画像が見え始めるような動きを組んでみました。 scroll_addclass.jsで視界に入った時にactiveというクラスをつけて、それが付いた後にカーテ…
qiita.com
