使按钮执行css代码并保存刷新

时间:2015-08-23 17:14:20

标签: html css button

我失败了。我尝试了一切但却无法让它发挥作用。

我要做的是有2个按钮:一个是全彩色,第二个是黑色和白色。

我知道我可以使用-webkit-filter: grayscale(100%);制作黑白图像,但我无法通过html按钮找到激活此代码的方法。我还希望使用localStorage.getItem("somehting")

在刷新时保存颜色

我有工作“模特”与原来的图片改变另一个(这是我尝试使一个图片黑色和白色和其他全彩色,但我没有工具来制作它)所以如果你想我可以上传它。感谢

编辑:jsfiddle.net/6hpqoypz这是我用来在彼此之间更改图片的方式

1 个答案:

答案 0 :(得分:0)

我自己开始工作了。对于通过搜索找到这篇文章的人我使用了这个:

    <!DOCTYPE html>

<html>
<body>
<img id="Ispanija1" src='Ispanija1(n).gif'>
<button onclick="Ispanija1_t()"> Turiu.</button>
<button onclick="Ispanija1_n()"> Neturiu.</button>
<style id="Ispanija1style"></style>
<script>
window.addEventListener('load', Ispanija1load1, false)
function Ispanija1_t() {document.getElementById("Ispanija1style").innerHTML="#Ispanija1"; localStorage.setItem('Ispanija1', "#Ispanija1");}
function Ispanija1_n() {document.getElementById("Ispanija1style").innerHTML="#Ispanija1 {-webkit-filter: grayscale(100%);}"; localStorage.setItem('Ispanija1', "#Ispanija1 {-webkit-filter: grayscale(100%);}");}   
var Ispanija1 = localStorage.getItem("Ispanija1")
function Ispanija1load1() {document.getElementById("Ispanija1style").innerHTML = Ispanija1}

</script>
</body>

</html>