Ember.js 鼠标悬停在余烬上

我是新来的灰烬。我希望当我将鼠标悬停在.png文件上时，它是透明的，并且存在于右角的“X”按钮上，当您按下它时，它将从存储中删除。有什么想法或例子吗？我有以下文件：

showactivecamp.hbs

<style type="text/css">


    .image {
        width: 190px;
        height: 190px;
        opacity: 1;

    }

    .image:hover {
        opacity: 0.3;
    }

    i.fa-remove {
    @extend . image : hover;
        color: #fff;
        background-color: #808080;
        background-color: rgba(0, 0, 0, 0.5);
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 2px;
        z-index: 1;
        cursor: pointer;
    }


</style>

<div class="thmb-prev">

                    <button type="button" class="fa fa-remove" {{action "removeCampaign" on="click"}}>


                    </button>
                    <img src="/assets/images/photos/media2.png" class="image" alt="">

                </div>

视图\showactivecamp.js 从“余烬”导入余烬

export default Ember.View.extend({

    click: function (evt) {
        this.get('controller').send('click', this.get('campaign'));
    }

 });

---

你发布了你的代码，但没有提到这个问题。我不确定你遇到了什么问题

看看这个jsbin。我用过FixtureAdapter

更新：

我已在名为“图像”的视图中包装图像并关闭图标。X图标将显示在鼠标输入上，并使用jQuery在鼠标离开时隐藏

As Ember guide says, Use View when you need sophisticated handling of user events.

---

我建议您仔细阅读文档，以清楚地了解ember中的视图和事件处理。

我认为最好使用CSS解决方案来处理此类问题，而不是在Javascript中创建不必要的视图

---

到目前为止你有什么？我很愿意帮忙，但我也希望看到你的努力。祝你好运，欢迎来到SO。这是一个css问题，关于从商店中删除记录，请查看路由和如何处理操作。查看更新的帖子。是的，类似这样的内容。但我希望在悬停图像时显示x按钮。谢谢。我会试试的。非常感谢亚历克斯！顺便说一句，有没有地方可以在线运行您的项目？不，现在不需要，但只需自己克隆存储库并运行余烬服务就很容易了。演示版有点过时，因为它在较旧的CLI版本上，但如果您在应用程序的分析处理方面需要帮助，原则仍然可以完美地工作。当我有时间的时候，我将把这个演示移植到最新版本的EmberCLI上

As Ember guide says, Use View when you need sophisticated handling of user events.