-1
JavaScriptを使ってアニメーションを作成しているときに修正するのに問題がありましたが、表示されません。私は "ムーバー"関数でパンの動作をしようとしているが、私は間違って "transformOrigin"内のプロパティを使用していると思うか、私はいくつかのステップが不足している、またコンソールにエラーが表示されません。あなたはを通してthisを渡す必要がjavascriptの構文エラー
function cambio(c) {
document.getElementById("pb").src=c;
}
function zoom() {
document.getElementById("pb").style.transform="scale(1.8)"; \t \t \t
}
function zoomout() {
document.getElementById("pb").style.transform="";
}
function mover(element) {
document.getElementById("pb").style.transformOrigin=((event.pageX - element.offsetLeft)/element.width) * 100 + "% " + ((event.pageY - element.offsetTop)/element.height) * 100 + "%";
}body {
display: flex;
flex-flow: row nowrap;
}
#big {
width: 300px;
height: 250px;
overflow: hidden;
}
#pb{
width: 300px;
transition: transform 0.25s ease;
}
#tumbnail {
width: 60px;
overflow: hidden;
}
#tumbnail img{
width: 60px
}
#tumbnail img:hover {
opacity: 0.5;
transition: all 300ms ease;
}<div id="tumbnail">
\t <a href=""><img src="http://www.cosmoscreativeagency.com/imagenes/1.jpg" onmouseover="cambio('http://www.cosmoscreativeagency.com/imagenes/1.jpg')" ></a>
\t <a href=""><img src="http://www.cosmoscreativeagency.com/imagenes/2.jpg" onmouseover="cambio('http://www.cosmoscreativeagency.com/imagenes/2.jpg')" ></a>
\t <a href=""><img src="http://www.cosmoscreativeagency.com/imagenes/3.jpg" onmouseover="cambio('http://www.cosmoscreativeagency.com/imagenes/3.jpg')" ></a>
\t <a href=""><img src="http://www.cosmoscreativeagency.com/imagenes/4.jpg" onmouseover="cambio('http://www.cosmoscreativeagency.com/imagenes/4.jpg')" ></a>
</div>
<div id="big">
\t <img src="http://www.cosmoscreativeagency.com/imagenes/1.jpg" id="pb" onmouseover="zoom()" onmouseout="zoomout()" onmousemove="mover(this)">
</div>
何のエラー[コンソールのレポートを？]（http://stackoverflow.com/documentation/javascript/185/hello-world/714/using -console-log） –
未知のReferenceError：offsetLeftが定義されていません at mover（http：//localhost/kenny2/ejercicio2.html：55：71） at HTMLImageElement.onmousemove（http：//localhost/kenny2/ejercicio2.html） ：41：93） –
これは構文エラーではありません（ "Re ferenceError "）。あなたは 'offsetLeft'と' offsetTop'を探していますか？上記のトピック外の理由を読んで、必要な情報をあなたの質問に編集してください。 – Ryan