setlocal rem /* 今日の日付を取得(yyyymmdd) */ set now=%date:~-10,4%%date:~-5,2%%date:~-2,2% rem /* ○○に日付を入れてをバックアップ */ xcopy /Y /E C:\○○ D:\○○_%now%\ rem /* 一時停止 */ pause endlocal
これで自動でバックアップを取ってくれるプログラムの完成です。
毎日作業するExcelのバックアップなどを設定しておけば一日30秒の短縮。ファイル数によってはもっと時間の節約になりますね。
See the Pen CSSで画像をぼかしてオンマウスした画像だけ鮮明に by maru (@maru0014) on CodePen.
img { width:30%; -webkit-filter: blur(2px); filter: blur(2px); }
filterプロパティはその名のとおり画像にフィルターをかけることができます。
これを使って画像をぼかして、hover時に通常表示に直しています。
img { width:30%; -webkit-filter: grayscale(100%); filter: grayscale(100%); } img:hover { -webkit-filter: grayscale(0%); filter: grayscale(0%); }
その他にも色々なエフェクトがかけれる！ ↓こちらが参考になります。
ECサイトなどでタグの規制があり、JavaScriptが使えない環境下でもこれなら可能。
jQueryなどで実装する場合はスクロールイベントを拾ってきて表示させるんじゃないかと思いますが、 この場合はheader部分の背面にフローティングメニューを隠しておくイメージです。
z-index:2;を指定するz-indexを指定するにはpositionの指定も必要なので、position:relative;も指定します。
これでheaderが最前面に表示されることになります。
z-index:1;を指定するこちらはフローティング化するので、
position:fixed;とtop:0;を指定します。
これでheaderの背面に隠れることになります。
See the Pen CSSのみで「スクロールすると表示されるフローティングメニュー」 by maru (@maru0014) on CodePen.
headerに背景色もしくは背景画像を付けるのを忘れずにね！
HTML5&CSS3デザインブック (ステップバイステップ形式でマスターできる)
IE11では正常にhtmlが読み込まれるのに対して、IE10では表示されない。
IE10は.load()メソッドは対応しているはずなのに・・・。
まず疑ったのはキャッシュ。
キャッシュを全て削除して更新してみたが改善されない。
原因は・・・・。
<script> $(function() { // 文字コードの修正 $.ajaxSetup({ beforeSend: function(xhr) { xhr.overrideMimeType("text/html;charset=euc-jp"); } }); // 共通パーツ読み込み $("#header").load("../parts/header.html"); $("#side").load("../parts/side.html"); $("#footer").load("../parts/footer.html"); }); </script>
上記を見たら皆さんお気づきかと思いますが、僕は15分くらい悩んだ末IEのデバックツールで見たら一発でした。（一番最初に確認するべきだった・・・）
文字コードの修正の部分は、euc-jpで作られたhtmlがajaxによってutf-8に強制変換され文字化けしてしまうのを防ぐために書いたのですが、overrideMimeTypeはIE10以下非対応でした。
これのせいでscriptが停止し、読み込まれなかったわけです。
IE10はまだまだ利用者の多いブラウザのため切り捨てるわけにはいかず、パーツとなるhtmlの文字コードをutf-8にし、overrideMimeTypeを廃止しました。
今回の件で調べているうちにキャッシュが原因で1回めのアクセス時に表示されず、リロードすると表示されるなどの不具合があるという記事が見つかったので、念の為にキャッシュさせない設定を組み込みました。
<script> $(function() { // キャッシュOFF $.ajaxSetup({ cache: false }); // 共通パーツ読み込み $("#header").load("../parts/header.html"); $("#side").load("../parts/side.html"); $("#footer").load("../parts/footer.html"); }); </script>
タイトルではちょっとわかりづらいかな・・・。
例えば
<h1>見出し</h1>
というHTMLがあったときに、jQueryで
<h1><div>見出し</div></h1>
というふうに内側のテキストなどをタグで囲める。
通常なら普通にタグを記述すればいい話なのだが、
などに便利である。
See the Pen 要素内のtextをタグで囲むjQuery by maru (@maru0014) on CodePen.
上記の場合はボーダーがついたh1タグの内側をdivで囲みdivに対してborder-leftを付けることで見出しのデザインを作っている。 このように既存のhtml構造では不都合がある場合に一括でタグを追加することができる。
このスクリプトはjQueryが必要なので、まず
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
を記述してライブラリを読み込む
<script> $(function(){ $("外側のタグ").wrapInner("内側を囲むタグ"); }); </script>
と記述。
今回の例の場合では
<script> $(function(){ $("h1").wrapInner("<div></div>"); }); </script>
となる。
以上、要素内のtextをタグで囲むスクリプトでした。
