回答編集履歴
3
クッキーが使えない原因を記載
test
CHANGED
|
@@ -64,30 +64,32 @@
|
|
|
64
64
|
|
|
65
65
|
|
|
66
66
|
|
|
67
|
-
|
|
67
|
+
# クッキーが使えない原因
|
|
68
68
|
|
|
69
|
-
|
|
69
|
+
**ローカルで、HTMLを開いている**からです。
|
|
70
70
|
|
|
71
|
-
|
|
71
|
+
ローカルでの通常実行の場合、ブラウザのセキュリティに引っかかるため、
|
|
72
72
|
|
|
73
|
-
|
|
73
|
+
**クッキーへの保存ができません**。（下手すると読み込みもできない）
|
|
74
74
|
|
|
75
|
-
|
|
75
|
+
Google Chromeでは特になのですが、最近のブラウザのセキュリティはかなり強いものになりますので、
|
|
76
76
|
|
|
77
|
+
様々な機能が制限されます。
|
|
78
|
+
|
|
77
|
-
|
|
79
|
+
よって、下記のいずれかをする必要があります。
|
|
78
80
|
|
|
79
81
|
|
|
80
82
|
|
|
81
|
-
|
|
83
|
+
- ローカルファイルHTMLを開く際に、ブラウザをオプション起動し、CORSを回避する
|
|
82
84
|
|
|
83
|
-
|
|
85
|
+
- XAMPP（Windowsの場合）や、MAMP（macOSの場合）を使い、**ローカルサーバー**を立てて、httpアクセスでページを開く
|
|
84
|
-
|
|
85
|
-
```
|
|
86
86
|
|
|
87
87
|
|
|
88
88
|
|
|
89
|
-
|
|
89
|
+
上記をやる方法に関しては、本質問要件から逸脱するため、割愛します。
|
|
90
90
|
|
|
91
|
-
|
|
91
|
+
ご自身でやり方を再度調査してください。
|
|
92
92
|
|
|
93
|
+
|
|
94
|
+
|
|
93
|
-
|
|
95
|
+
以上です。
|
2
cookie.jsについて言及
test
CHANGED
|
@@ -61,3 +61,33 @@
|
|
|
61
61
|
|
|
62
62
|
|
|
63
63
|
```
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
|
|
67
|
+
二つ目（一つ目も合わせて）が動かないのは、必要なJavaScriptファイルをHTMLと同じ階層に置いておらず、
|
|
68
|
+
|
|
69
|
+
また、HTML内でJSファイルの読み込みをしていないのではないでしょうか。
|
|
70
|
+
|
|
71
|
+
参考記事にあります、DEMOページからの下記URLのJavaScriptをコピーして、
|
|
72
|
+
|
|
73
|
+
[pixiv小説のようにCSS3とjQueryでHTMLを縦書き表示する方法【I'll be NET】で使用している、cookie.js](https://illbenet.jp/files/medias/entry/css/201910pixiv/js.cookie.js)
|
|
74
|
+
|
|
75
|
+
同名のファイルとして保存し、HTMLと同じ階層にファイルを置きます。
|
|
76
|
+
|
|
77
|
+
そして、下記のようにHTMLに記述して、JSファイルを読み込んでください。
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
```html
|
|
82
|
+
|
|
83
|
+
<script src="js.cookie.js"></script>
|
|
84
|
+
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
参考記事はたまーに、必要なことが全部書いてない、初心者には大変よろしくない記事がけっこうあったりします。
|
|
90
|
+
|
|
91
|
+
なので、動かない時は、記事のソースコードと自身のコードの差異をにらめっこして、間違いを見つけるのと同時に、
|
|
92
|
+
|
|
93
|
+
記事に書いてないことが、DEMOページに書かれていたりしないか確認してみるといいでしょう。
|
1
マークダウンのイタズラを修正
test
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
各構文のID指定が、小文字スタートになってるからです。
|
|
2
2
|
|
|
3
|
-
#white → #White
|
|
3
|
+
`#white` → `#White`
|
|
4
4
|
|
|
5
5
|
です。
|
|
6
6
|
|