如何解决创建鼠标悬停产品卡
所以我正在使用bootstrap和reactjs创建产品页面。我想拥有一种特殊的功能,如果有人将鼠标悬停在产品卡(引导卡)上,它将立即播放该产品的幻灯片并继续循环播放。知道我该怎么做吗?目前,产品代码如下:
<div class="card" style="width: 18rem;">
<img src="https://static.nike.com/a/images/t_PDP_864_v1/f_auto,b_rgb:f5f5f5/7637d664-a6fc-4023-a2f3-2be560e9a5fc/air-jordan-1-low-shoe-z3Tl2VeJ.jpg" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
我要在幻灯片中显示的其余两张图像是:
https://static.nike.com/a/images/t_PDP_864_v1/f_auto,b_rgb:f5f5f5,q_80/fbddc2be-ba01-4c49-a178-0e7c09d46cf9/air-jordan-1-low-shoe-z3Tl2VeJ.jpg
https://static.nike.com/a/images/t_PDP_864_v1/f_auto,q_80/3c15fb97-aaca-4f7d-a318-8a468b21608a/air-jordan-1-low-shoe-z3Tl2VeJ.jpg
https://static.nike.com/a/images/t_PDP_864_v1/f_auto,q_80/cc655e90-ec54-47a5-8568-1e55df425421/air-jordan-1-low-shoe-z3Tl2VeJ.jpg
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。