Javascript Jquery幻灯片效果无法正常工作
嗨，我正在尝试为某个文本制作一个滑动效果，滑动效果广告有点像额外的边距 效果是：， 框架是 问题是：有没有可能隐藏这个“边际” })) “像边距之类的” 我不太明白这是什么意思。如果要基于“悬停”设置元素的动画，则不需要jQueryJavascript Jquery幻灯片效果无法正常工作,javascript,jquery,html,css,slide,Javascript,Jquery,Html,Css,Slide,嗨，我正在尝试为某个文本制作一个滑动效果，滑动效果广告有点像额外的边距 效果是：， 框架是 问题是：有没有可能隐藏这个“边际” })) “像边距之类的” 我不太明白这是什么意思。如果要基于“悬停”设置元素的动画，则不需要jQuery .collapse1 { margin: 10px; transition: margin .5s linear; } .collapse1:hover { margin: 0px; } 这将使.callapse1上的边距在悬停时在10p
.collapse1 {
margin: 10px;
transition: margin .5s linear;
}
.collapse1:hover {
margin: 0px;
}
这将使.callapse1上的边距在悬停时在10px和0px之间转换：）如果您只想在没有任何边距的情况下对文本进行滑动效果， 您真的不需要依赖jQuery：（使用一点CSS，纯JS就足够了）
第1栏{
宽度：400px；
位置：绝对位置；
顶部：50px；
左：-400px；
}
功能滑块（el）{
var elem=document.getElementById（el）；
elem.style.transition=“0秒后保持0.5秒的轻松度”；
elem.style.left=“0px”；
}
功能滑出（el）{
var elem=document.getElementById（el）；
elem.style.transition=“左0.5s慢出0s”；
elem.style.left=“-400px”；
}
滑入
滑出
框1中的内容。。。
如果需要解释，您可以参考（视频教程）链接。您可以使用jquery selector.css更改任何css样式
$(document).ready(function() {
$('.collapse1').hover(function() {
$('.collapsetext1').css("margin", "");
});
});
你能用一个JSFIDLE来演示你面临的问题吗？如果没有HTML或演示，你问的问题一点也不清楚。我确实在JSFIDLE上放了一张正在发生的事情的照片，因为它没有这个框架。我希望灰色只出现在文字上，而不是大声吼叫。照片是“像边缘或其他东西”*好的，我的错误是在线版本的问题，你能详细解释一下你的问题吗？当你在菜单上悬停第一个IMG时，它有悬停效果，但是悬停元素从菜单中出来，在菜单上，在菜单上有一点吼叫，我希望它只是一个菜单（li元素）。在线版的问题悬停在菜单上的第一个元素，它似乎去了一点咆哮与悬停效果，我希望它不要这样做。
<!DOCTYPE html>
<html>
<head>
<style>
div#box1 {
width: 400px;
position: absolute;
top: 50px;
left: -400px;
}
</style>
<script>
function slideIn(el){
var elem = document.getElementById(el);
elem.style.transition = "left 0.5s ease-in 0s";
elem.style.left = "0px";
}
function slideOut(el){
var elem = document.getElementById(el);
elem.style.transition = "left 0.5s ease-out 0s";
elem.style.left = "-400px";
}
</script>
</head>
<body>
<button onclick="slideIn('box1');">slide in</button>
<button onmouseover="slideOut('box1');">slide out</button>
<div id="box1">Content in box 1 ...</div>
</body>
</html>
$(document).ready(function() {
$('.collapse1').hover(function() {
$('.collapsetext1').css("margin", "");
});
});