Question

我目前正在尝试为那些技术不太友好的人建立一个网站，并且该网站规范的一部分是首页上有8个图像，这些图像的翻转图像可以链接到相应的类别。现在我知道在css或javascript中这很容易，但我希望客户端能够使用小部件功能重新排列这些图像的顺序，同时还能够替换图像，给它一个新的链接和设置鼠标悬停图像，不触及任何代码。

我到目前为止所尝试的是使用wordpress简单图像插件（它提供了窗口小部件和链接功能）以及窗口小部件css类选择器，以使客户端能够选择相关的类别类别css中的预设翻转图像，但我不认为可以通过这种方式完成。

有什么建议吗？

Answer 1

As per i understand, It can be done by simple html/css no need to use any plugin just you have to do some development and give the functionality to upload and update images with related links.

make one simple Div structure and give display property in css to get hover effect.
just make one structure and make it into a loop so client can move it any where in given area.
Simple structure as below.

HTML:
<div class="img_block">
    <img src="something.jpg" alt="" />
    <div class="hover_block">
        <a href="www.stackoverflow.com">
            <img src="another.jpg" alt="" />
        </a>
    </div>
</div>

Css:
.img_block {}
.hover_block{display:none; position:absolute; left:0; top:0;}
.hover_block img{width:100%; height:100%;}/* If require */
.img_block:hover .hover_block{display:block;}

Wordpress CSS悬停图像作为小部件？

1 个答案: