我知道如何制作幻灯片,但是如何实际链接它以更改图像的不透明度?
如果有人真的帮了我,我真的很感激。我知道你使用jquery但我不知道从哪里开始才能做到这一点。
当我从左向右滑动滑动条时,我需要更改图像不透明度。
答案 0 :(得分:0)
在onChange
滑块上,您应该更改元素的CSS样式。
function onChange(var range){
$("#yourElement").css("opacity", 100/range);
}
您可以在滑块文档中找到此功能的位置。
答案 1 :(得分:0)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="jquery.js"></script>
<script>
$(document).ready(function(e) {
$("#myrange").change(function(e) {
$("h1").html(this.value);
$("img").css("opacity",this.value);
});
});
</script>
</head>
<body>
<input type="range" min="0" max="1" step=".01" value="0" id="myrange"><h1>0</h1>
<img src="PPP.jpg">
</body>
</html>
答案 2 :(得分:0)
<!--You may-->
<html>
<head>
<title>YourTestPage-OpacityImage</title>
<script type="text/javascript">jquery-1.11.1.js</script>
<script type="text/javascript">ChangeOpacity.js</script>
</head>
<body>
<div>
<p><img src="YourImage.jpg" id="YourImage"/></p>
<input typy="range" name="points" id="points" value="0" min="0" max="100" data-show-value="true">
</div>
</body>
</html>
<!--Your script-ChangeOpacity.js-->
$(document).ready(function(){
$("#points").change(function(){
var ValuePoint=$("#points").val();
var Range=ValuePoint/100;
$("#YourImage").fadeTo("slow",Range);
});
});