1
我爲wordpress使用divi主題，我選擇了代碼模塊，並試圖獲得網站圖片以便在懸停時進行滾動並反轉當懸停結束時滾動...因此將圖像返回到其原始位置。網站前有一張圖片。基本上，這給出了用戶從計算機向下滾動網頁的外觀。這個想法最初是在dividojo.com上發現的（好主意dividojo！）https://www.dividojo.com/website-design/它位於頁面的底部。通過Wordpress Divi創建圖像內部的圖像主題代碼模塊
我有以下代碼在wordpress以外完整的代碼功能。
<!DOCTYPE html>
<html>
<head>
<title>animatingimage</title>
<link href="css/style.css" rel="stylesheet" />
<script type="text/javascript" src="jquery-3.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#insideComputer").hover(function() {
$("#insideComputer").stop(true).animate({
marginTop:"-1210px"
}, 5000);
},
function(){
$("#insideComputer").stop(true).animate({
marginTop:"0px"
}, 5000);
});
});
</script>
</head>
<body>
<div id="bigDiv">
<img id="computer" src="img/computer3.png">
<div id="imgDiv">
<img id="insideComputer" src="img/website1.png">
</div>
</div>
</body>
</html>
這裏是附加的外部CSS。
#bigDiv {
background-color: #F5F5F5;
width: 500px;
height: 500px;
margin: 200px;
}
#imgDiv{
width: 463px;
height: 269px;
position: relative;
top: -430px;
left: 19px;
overflow: hidden;
}
#insideComputer {
width: 100%;
}
就像我說的，上面的功能適當。我正在嘗試將此輸入到divi主題中。我已經修改了上面的代碼如下：
<style>
#bigDiv {
background-color: #F5F5F5;
width: 500px;
height: 500px;
margin: 200px;
}
#imgDiv{
width: 463px;
height: 269px;
position: relative;
top: -430px;
left: 19px;
overflow: hidden;
}
#insideComputer {
width: 100%;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$("#insideComputer").hover(function() {
$("#insideComputer").stop(true).animate({
marginTop:"-1210px"
}, 5000);
},
function(){
$("#insideComputer").stop(true).animate({
marginTop:"0px"
}, 5000);
});
});
</script>
<div id="bigDiv">
<img id="computer" src="http://localhost/kaiserkreations/wp-
content/uploads/2017/08/computer3.png">
<div id="imgDiv">
<img id="insideComputer" src="http://localhost/kaiserkreations/wp-
content/uploads/2017/08/website1.png">
</div>
</div>
與所有我看過的文件，我應該能夠把這個迪維代碼模塊的內容部分的內部，並將它適當的工作。當我把這個塊放到模塊中時，我看到了圖像，格式是合適的，但動畫已經死了。我知道Jquery工作正常，因爲當我測試一個警報功能時，它工作正常。
任何想法，我錯了。我看了，但無法找到類似堆棧溢出的任何東西。
謝謝你們！