回答編集履歴
3
edit
answer
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
背景画像をあてているのがrange自体ではなく、疑似要素だからだと思います。
|
|
2
2
|
|
|
3
|
-
「JavaScriptから疑似要素を取得」とう観点で調べてみましたら、[Window.getComputedStyle()](https://developer.mozilla.org/ja/docs/Web/API/Window/getComputedStyle)から
|
|
3
|
+
「JavaScriptから疑似要素を取得」という観点で調べてみましたら、[Window.getComputedStyle()](https://developer.mozilla.org/ja/docs/Web/API/Window/getComputedStyle)から
|
|
4
4
|
[CSSStyleDeclaration.getPropertyValue()](https://developer.mozilla.org/ja/docs/Web/API/CSSStyleDeclaration/getPropertyValue)というのが見つかりました。
|
|
5
5
|
ご参考まで。
|
|
6
6
|
```js
|
|
@@ -12,9 +12,8 @@
|
|
|
12
12
|
```
|
|
13
13
|
[JS/jQueryでCSS疑似要素である:before:afterのプロパティを取得し変更する](http://ithat.me/2016/09/29/js-jquery-pseudo-element-property-get-and-set)
|
|
14
14
|
|
|
15
|
+
-----
|
|
15
16
|
以下、編集前の回答
|
|
16
17
|
|
|
17
|
-
-----
|
|
18
|
-
|
|
19
18
|
画像が枠に対して大きすぎるだけですね。
|
|
20
19
|
[background-size](https://developer.mozilla.org/ja/docs/Web/CSS/background-size)で枠におさまるように調整してみてください。
|
2
edit
answer
CHANGED
|
@@ -1,4 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
背景画像をあてているのがrange自体ではなく、疑似要素だからだと思います。
|
|
2
2
|
|
|
3
|
+
「JavaScriptから疑似要素を取得」とう観点で調べてみましたら、[Window.getComputedStyle()](https://developer.mozilla.org/ja/docs/Web/API/Window/getComputedStyle)から
|
|
4
|
+
[CSSStyleDeclaration.getPropertyValue()](https://developer.mozilla.org/ja/docs/Web/API/CSSStyleDeclaration/getPropertyValue)というのが見つかりました。
|
|
5
|
+
ご参考まで。
|
|
6
|
+
```js
|
|
7
|
+
Array.from(document.querySelectorAll("input[type=range]"), r => {
|
|
8
|
+
var property = window.getComputedStyle(r, '::-moz-range-thumb').getPropertyValue('background-image')
|
|
9
|
+
console.log(property);//url("https://pngimg.com/uploads/free/free_PNG90756.png")
|
|
10
|
+
});
|
|
11
|
+
|
|
12
|
+
```
|
|
13
|
+
[JS/jQueryでCSS疑似要素である:before:afterのプロパティを取得し変更する](http://ithat.me/2016/09/29/js-jquery-pseudo-element-property-get-and-set)
|
|
14
|
+
|
|
15
|
+
以下、編集前の回答
|
|
16
|
+
|
|
17
|
+
-----
|
|
18
|
+
|
|
3
19
|
画像が枠に対して大きすぎるだけですね。
|
|
4
20
|
[background-size](https://developer.mozilla.org/ja/docs/Web/CSS/background-size)で枠におさまるように調整してみてください。
|
1
edit
answer
CHANGED
|
@@ -1,2 +1,4 @@
|
|
|
1
|
+
# 失礼。表示されないことが問題ではなかったですね
|
|
2
|
+
|
|
1
3
|
画像が枠に対して大きすぎるだけですね。
|
|
2
4
|
[background-size](https://developer.mozilla.org/ja/docs/Web/CSS/background-size)で枠におさまるように調整してみてください。
|