Question

function upDate(previewPic) {

    /* In this function you should
    1) change the url for the background image of the div with the id = "image"
    to the source file of the preview image
    2) Change the text of the div with the id = "image"
    to the alt text of the preview image
    */

    var m = document.getElementById("image");
    m.style.backgroundImage = "url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/389177/bacon.jpg')";
    var p = document.getElementById('image');
    p.innerHTML = previewPic.alt;
}

function unDo() {

    /* In this function you should
    1) Update the url for the background image of the div with the id = "image"
    back to the orginal-image. You can use the css code to see what that original URL was
    2) Change the text of the div with the id = "image"
    back to the original text. You can use the html code to see what that original text was
    */

    document.getElementById("image").style.backgroundImage = "url('')";
    document.getElementById('image').innerHTML = "Hover over an image to display here";
}

Answer 1

我怀疑这是作业，因此我只在这里给你一个部分答案：

function upDate(previewPic) {
    /* In this function you should
    1) change the url for the background image of the div with the id = "image"
    to the source file of the preview image
    2) Change the text of the div with the id = "image"
    to the alt text of the preview image
    */

    var m = document.getElementById("image");
    // now how would I fix this string concatenation up? hmmm
    m.style.backgroundImage = "url('" + previewPic.whattoplacehere +')";
    // comment out as we have this  var p = document.getElementById('image');
    // change to m from p as we had it already.
    m.innerHTML = previewPic.alt;
}

我们需要什么样的活动？我们似乎需要两个，第二个是什么？

var myimage = document.getElementById("myimage");
myimage.addEventListener("mousesomething", function(event) {
  var target = event.target,
    related = event.relatedTarget;
  upDate(what should be here?);
}, false);

研究： https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent

Answer 2

在JS中使用它，

document.getElementById("demo").style.backgroungImage = url(" ") ;

Html中的图像已经保存在src中，因此，previewPic.src将是图像链接。

不要忘记串联.. 像这样"url" + "(" + parameters.src + ")" ;

改变背景图像，因为你onmousemove上不同的图像javascript

2 个答案: