barriers / 阅读 / 详情

运用JavaScript写出如下效果: 要求:鼠标点击div块后,div由左边缓慢移动到右边.

2023-07-16 18:33:56
共2条回复
我不懂运营

html里面写一个div id=div1

div#div1{position:absolute;

width:300px;

height:300px;

left:0;

top:30px;

background:red;

}

window.onload = function(){

var div1 = document.getElementById("div1");

var cur = div1.offsetLeft;

var speed = 6;

div1.onclick = function(){

var timer = setInterval(function(){

if(cur > 500){

clearInterval(timer);

}else{

cur += speed;

div1.style.left = speed + cur +"px";

}

},30);

};

}

使用setInterval

豆豆staR

釆纳就写

相关推荐

margin-left 是啥意思

左边界
2023-07-16 13:57:203

样式padding-left和margin-left有什么区别?

padding-left 属性设置元素左内边距(空白)。该属性设置元素左内边距的宽度。行内非替换元素上设置的左内边距仅在元素所生成的第一个行内框的左边出现.注释:不允许使用负值。margin-left语法margin-left:[ | | auto ]{1,4}默认值: 0相关属性:[margin ] || [ margin-top ] || [ margin-right ] || [ margin-bottom ]取值auto:值被设置为相对边的值:用长度值来定义外补白。可以为负值:用百分比来定义外补白。可以为负值
2023-07-16 13:57:362

初学css 想问下margin-left 和left的区别

imgMain.style.marginleft是指 div距离页面左边的距离
2023-07-16 13:57:432

css中的定位left与margin-left有什么本质区别?分别怎么用好?

楼上说法有误,left并不是只有在绝对定位中才用的到,而是在定位中都用得到,left是用于定位的,表示左偏移量;margin-left是指左外边距,理解了盒子模型这个就很容易理解!想了解的更深入的话,去http://www.w3school.com.cn/htmldom/这里学吧!
2023-07-16 13:57:512

css 如何解决margin-left在ie中翻倍问题。

margin-left:30px;_margin-left:15px;需要这样,_margin-left:15px;只有ie识别
2023-07-16 13:57:582

CSS代码:left:10px margin-left:10px两者有什么区别?祥细!

left这个属性不能单独使用的,必须配合positionmargin指的是外边距
2023-07-16 13:58:063

margin-left 可以是负数吗

可以为负数正数向右偏移,负数向左偏移
2023-07-16 13:58:242

CSS代码问题: margin-left:10px; 边框距左10像素 什么情况下要从宽里减去这10像素 什么时候不用减去呢?

如果一个div中定义了width,就需要减去这个宽度。如果没有设置,就不需要减去减去。但是在一个div 中,最关注的应该是padding一个width是X像素的话,padding是Y像素,整个DIV的是X+Y
2023-07-16 13:58:344

Android 如何在Java代码中手动设置控件的marginleft

照一下思路:LinearLayout.LayoutParams abc = new LinearLayout.LayoutParams(。。。。。);abc.setMargins(。。。。);imageView.setLayoutParams(abc);
2023-07-16 13:58:431

知道padding-left和margin-left的区别,但CSS中left和padding-left有什么具体区别呢?

left是层位置属性设置,padding-left是层距离层左边距离设置
2023-07-16 13:59:014

为什么我做个导航,我想导航里面的文字靠左显示,。可是margin-left也不行,该怎么办呢?

字体居中这类啊 class="next" 这是什么? 你CSS里好像没这个定义吧 删了 .menu ul li{width:83px; height:29px; float:left; overflow:hidden; text-align:left; line-height:29px; margin-right:10px;}
2023-07-16 13:59:082

,设置了div的margin-left属性,但是在不同分辨率的显示器中的位置不同怎么解决?

设置百分比位置
2023-07-16 13:59:184

请问css的margin-left: -150px; margin-top: -100px的负号怎么理解

负号就是相反的方向
2023-07-16 13:59:273

layout_marginleft怎么在java类里面去控制它的属性啊?

同求,我也想知道怎么在java文件中设置这个属性的值?????
2023-07-16 13:59:353

margin-left:10px;和margin:0 0 0 10px;有什么区别

margin-left:10px; 是只限制和左边的距离margin:0 0 0 10px; 是限制里上下左右的距离
2023-07-16 13:59:541

LayoutParams的leftMargin属性是什么意思

LayoutParams的leftMargin属性是什么意思 - 已解决 - 搜狗问问3个回答 - 最新回答: 2014年1月15日最佳答案: 每一个元素都看作一个矩形的话,leftMargin就是本元素的矩形与左侧元素的矩形的间隔请采纳如果你认可我的回答,敬请及时采纳,~如果你认可我的回答,请及时点击【采纳为满意回答】按钮~~手机提问的朋友在客户端右上角评价点【满意】即可。~你的采纳是我前进的动力~~O(∩_∩)O,记得好评和采纳,互相帮助
2023-07-16 14:00:021

怎么获取margin-left的值

获取margin方法如下 var margT = jQuery(this).css("margin"); css中padding和margin的区别 margin 外边距 border 边框 padding 内边距 也就是说 设置margin 那么他所占据的空白地方会是在边框外面
2023-07-16 14:00:101

recyclerview分割线怎么设置marginleft

1 人工添加LinearLayout的分割线 我们可以创建一个View,这个View就是分割线,只要简单在Button之间添加这个分割线就可以。 分割线的实现,如下: So the whole layout, as pictured, becomes: 2 在LinearLayout定义divider 你可以给LinearLayou...
2023-07-16 14:00:171

jquery 的 animate({left:1000px},1000);和animate({marginLeft:1000px},1000);有什么区别呢?

设置left属性只对position设置了relative、absolute、fixed的元素有效;设置margin-left属性只对position为relative、static的元素有效!
2023-07-16 14:00:254

float:left margin-left区别

一个是左对齐,一个是左边距float对齐方式margin外边距padding内边距
2023-07-16 14:00:392

android:layout_marginLeft="10px"是什么意思?

控件与左边界距离10px
2023-07-16 14:01:053

css的提示框,{left: 50%;margin-left: -60px;}为什么能起到居中定位的效果呢?

绝对定位(position: absolute)是以父元素为基准点,进行定位。如果他没有父元素,或者它的父元素没有设置相对定位(position:relative)属性它就会以最近的非标准流盒子为基准点进行定位。
2023-07-16 14:01:132

document.body.style.marginLeft取不到值,为什么呢?

css DOM 里面的document.body.style.marginLeft 只能取到行内样式style="" 这样定义的样式的值外链CSS或者头部head区域放置的嵌入式都是取不到值的
2023-07-16 14:01:321

margin-left使其内容居中,可以用什么其他的代替?来居中呢?

不知道你要居中什么,如果文字的话text-align如果div居中,一条margin:0 auto
2023-07-16 14:01:391

left:50%; margin-left:-512px; z-index:1;什么意思?

l eft:50%; 是元素与盒子的距离margin-left:-512px; 是元素与盒子的左侧内边距left:50%; margin-left:-512px; 的作用主要是为了让这个div无论浏览器怎么拉伸都处于水平居中;z-index:1 是元素显示的层级设置多少值根据自己的需要设置数值越大就越显示在上层。
2023-07-16 14:01:461

leftmargin是什么意思,可以用什么代替?

leftmargin是左边距的像素数,topmargin是上边距的像素数,scroll是滚动条height是实体的高度bgcolor是背景颜色没有可代替的东西
2023-07-16 14:02:092

关于div css 中的 float 浮动问题,为什么margin-left属性在 IE和 火狐中显示不出来

  您好!很高兴为您答疑!  火狐下您可以安装Firebug检查页面代码,错误部分会有提示。  您可以在火狐社区了解更多内容。希望我的回答对您有所帮助,如有疑问,欢迎继续在本平台咨询。
2023-07-16 14:02:176

为什么margin-left有时会没用?

margin就是两个标记中间让出点空白,如果你就一个标记又是居左的话margin-right是没有效果的。语法:margin-left:[ | | auto ]{1,4}默认值: 0相关属性:[margin ] || [ margin-top ] || [ margin-right ] || [ margin-bottom ]取值auto:值被设置为相对边的值。用长度值来定义外补白:可以为负值。用百分比来定义外补白:可以为负值。说明:检索或设置对象左边的外延边距。内联对象可以使用该属性设置左边距。外延边距始终透明。对应的脚本特性为 marginLeft。示例:test {margin - left: 50px;background: #ee; }test { margin - left: 50px; background: #eee; }
2023-07-16 14:02:551

masonry 里 left 和 left margin 有什么区别

边界margin和补白padding(依据国内出版社的翻译惯例,margin被翻译成边界,padding被翻译成补白,译者依照习惯翻译。但译者认为,margin翻译成外边距,padding翻译成内边距更为直白和形象。你可以依据自己的习惯来适应这两种不同的译法。——译者注)是隔开元素最常用的两个属性。边界是元素外边的距离,而补白则是元素内部的距离。
2023-07-16 14:03:041

margin-left:10px;和margin:0 0 0 10px;有什么区别?

margin-left:10px; 是只限制和左边的距离margin:0 0 0 10px; 是限制里上下左右的距离
2023-07-16 14:03:391

CSS控制文字往左边移动30px 求助!

marginleft:30px应该可以,呵呵。
2023-07-16 14:03:493

怎么让margin-left左边第一个边距不显示?而后边的都有边距!

Margin: 上 右 下 左
2023-07-16 14:03:571

jquery 怎么实现从右到左滑出来的效果

试试:$("#proList").show("slide", { direction : "right" //可以选"left", "right", "up", "down" }, 500,function(){ //500表示过渡时间单位ms //dosomething });
2023-07-16 14:04:152

div里定位margin-left: -10px;为什么在IE7可以正常显示效果~在IE6里却看不到效果?该怎么写?

是不是没有加浮动,加个float:left 试下呢
2023-07-16 14:04:233

masonry 里 left 和 left margin 有什么区别

边界margin和补白padding(依据国内出版社的翻译惯例,margin被翻译成边界,padding被翻译成补白,译者依照习惯翻译。但译者认为,margin翻译成外边距,padding翻译成内边距更为直白和形象。你可以依据自己的习惯来适应这两种不同的译法。——译者注)是隔开元素最常用的两个属性。边界是元素外边的距离,而补白则是元素内部的距离。
2023-07-16 14:04:301

是什么意思

div行高为150%,外部左边距为15像素。
2023-07-16 14:04:383

css 移动端ul width:96%时,里面的li width:22.5%,margin-left:2%,左侧与右侧的边距不等

里头的加起来没有百分百只有98%,给第一个li,margin-left下。nav ul li:first-child{ margin-left:1%;}
2023-07-16 14:04:451

这是一个段落.是什么意思

在前端 p表示段落 margin-left :左外边距 color:颜色 这段代码的意思是:表明一个段落 这个段落里面的字的颜色是赭色 左边的边距是20像素
2023-07-16 14:04:521

leftmargin是什么意思

可以使用CSS样式表啊,兼容性比较好,楼主的这些标签很像是用FRONTPAGE作的,插入<head></head>之间<style type="text/css">body {margin-left:10px; /*网页左边距 单位是px*/margin-top:10px; /*网页上边距 单位是px*/height:600px; /*网页高度 单位是px 一般不这样定义*/background:url(背景图片地址) #ffffff no-repeat left top; /*背景图片 背景色 背景图片不重复 背景图片放在页面左上角*/overflow-x:hidden; /*隐藏水平滚动条*/}</style>
2023-07-16 14:04:591

把一个层设置浮动之后怎样再让它居中显示啊?

【居中显示】“居中显示”的意思是高亮层位于视框左右上下居中的位置。实现这个有两个方法:1,视框宽度减去高亮层宽度的一半就是居中需要的left值;2,先设置left值为50%,然后marginLeft设为负的高亮层宽度的一半。方法1相对方法2需要多一个视框宽度,而且方法2在缩放浏览器时也能保持居中,明显方法2是更好,不过用margin会影响到left和top的计算,必须注意(例如SetFix修正的地方)。这里我选择了方法2,还要注意offsetWidth和offsetHeight需要在高亮层显示之后才能获取,所以定位程序需要放到高亮层显示之后:this.Box.style.top=this.Box.style.left="50%";if(this.Fixed){this.Box.style.marginTop=-this.Box.offsetHeight/2+"px";this.Box.style.marginLeft=-this.Box.offsetWidth/2+"px";}else{this.SetCenter();}其中如果不是固定定位,需要用SetCenter程序来修正滚屏参数,SetCenter程序是这样的:this.Box.style.marginTop=document.documentElement.scrollTop-this.Box.offsetHeight/2+"px";this.Box.style.marginLeft=document.documentElement.scrollLeft-this.Box.offsetWidth/2+"px";详细看参考资料
2023-07-16 14:05:271

JS让div左右来回滚动,到达页面右端时,从右端回到左端,然后到达左端时,从左端到达右端

健康vs蚝酒大会金凤凰客家话五毒教防护和3
2023-07-16 14:05:373

CSS中.a {margin-left: 35px;.b {display: flex;}}这是什么写法?

css标准中是没有这种写法的。或许这是某个框架的自定义用法?
2023-07-16 14:05:442

LayoutParams的leftMargin属性是什么意思

LayoutParams的leftMargin属性每一个元素都看作一个矩形的话,leftMargin就是本元素的矩形与左侧元素的矩形的间隔。-----请采纳~
2023-07-16 14:05:521

Android-ConstraintLayout(约束布局)-Centering/Circular and with Bias了解一下

居中显示不难哈,分两种:水平居中、垂直居中; 在相对布局里面可以 layout_centerXxxxxx 来设置居中,而在约束布局里面是这样考虑的:其实居中就是既然靠左/上,也要靠右/下, 这样渲染时就知道, “哦,原来你是想居中哇”。 然后现在我们有两个控件都设置了左右上的相对位置约束, 都居中了。现在我想让其中一个控件距离parent左边=%20 screen_width?一旦你设置了既靠左,又靠右,那么自然就是居中了,怎么设置距离左边距离呢? 其实有两种, 一是设置间距, 第二种是利用偏离率 layout_constraintHorizontal_bias *来设置百分比. 1.利用 layout_marginLeft 来设置间距,你还需要适配不同分辨率机型,麻烦。而且还需要注意一点,利用marginLeft时不能设置靠右属性哟!!!其实想想,有了marginleft,还需要靠右属性么?自然没有必要了塞.... 2.领用bias的话就好些了,至少利用百分比不用去做什么适配,能保证不同分辨率机型上比例一致.. a。首先看看居中,以及marginleft的方式: b。再看看bias的方式 在布局管理器你也可以随意拖动调试查看各种布局的效果,琢磨琢磨就会越来越熟悉。嗯。加油,么么哒.... 官网: ConstraintLayout | Android Developersu200bdeveloper.android.google.cn
2023-07-16 14:05:581

四种常用布局使用方法

一、 FrameLayout(帧布局): 显示特点:所有的子控件默认显示在FrameLayout的左上角,会重叠在一起显示。 常用属性: layout_gravity(设置给子控件,调整控件在容器内的重心) 还可配合layout_marginTop,layout_marginLeft属性指定组件位置 常用值: left(左)、 right(右)、 top(上)、 bottom(下)、 center(中心)、 center_vertical(竖向中心) center_horizontal(横向中心) 二、 LinearLayout(线性布局): 显示特点:所有子控件按照横向或者竖向依次排列,android:orientation="vertical"(竖向),android:orientation="horizontal"(横向)。 常用属性: ①gravity(控件本身内的重心位置) 常用值: enter_vertical(竖向中心)、center_horizontal(横向中心) 注意的是属性还可以这样使用 android:gravity="bottom|center"表示底 部中心 ②layout_gravity(控件在父容器内的重心位置) 常用值: left(左)、right(右)、top(上)、bottom(下)、center(中心)、 enter_vertical(竖向中心)、center_horizontal(横向中心) ③layout_weight(权重值) 子控件的用法: android:layout_weight="1" 多个控件同时使用,可以实现平分的效果 ④ weightSum(权重总和) 三、 RelativeLayout(相对布局) 显示特点:和LinearLayout布局相似,所有子控件默认显示在RelativeLayout的左上角 常用属性: ①在指定控件的哪一边:(注意:这些属性都需要有一个指定的id) layout_toRightOf 在指定控件的右边 layout_toLeftOf 在指定控件的左边 layout_above 在指定控件的上边 layout_below 在指定控件的下边子控件对齐关系 常见的效果: ②指定和那个控件的对齐方式(注意:这些属性都需要有一个指定的id) layout_alignRight 与指定控件右对齐 layout_alignLeft 与指定控件左对齐 layout_alignTop 与指定控件上对齐 常见的效果: ③子控件与父容器间对齐关系(这些属性的值为true或false) layout_centerInParent 与父容器中间对齐 pairunte layout_centerVertical 与父容器竖向中心对齐 layout_centerHorizontal 与父容器横向中心对齐 layout_alignParentLeft 与父容器左边对齐 layout_alignParentTop 与父容器上边对齐 layout_alignParentRight 与父容器右边对齐 layout_alignParentBottom 与父容器下边对齐 四、 GridLayout(网格布局) 显示特点:所有子控件默认在GridLayout中横向依次排列,当只等每行的列数时,到达指定列数 会自动换行显示。 常用属性: layout_column 在网格的第几列 layout_row 在网格的第几行 layout_columnSpan 跨列 layout_rowSpan 跨行 layout_gravity 在一个网格中的重心位置 columnCount 每行列总数 常见的效果: 总结:当某些控件在水平或垂直方向上依次排列时使用线性布局。 当控件之间的位置关系特别复杂时使用相对布局。相对布局可以指定控件相对某个控件的位置及和谁对齐。 帧布局:TODO 网格布局:当空间排列成网格状时使用网格布局。
2023-07-16 14:06:061

关于CSS中margin-left在不同浏览器冲突如何解决

margin-left:80px!important margin-left:30pxIE对 !important margin-left:30px 不做解读
2023-07-16 14:06:282

如何设置table的margin值?

<table margintop="12px" marginleft="10px">
2023-07-16 14:06:341

请教:js图片移动特效

百度一下,网上有很多这样的特效的,推荐 懒人之家,里面特效蛮齐全的
2023-07-16 14:06:421

android:layout_margin="10dip"; margin用法,他的意思是什么? dip是什么单位?

在android上开发的程序将会在不同分辨率的手机上运行。为了让程序外观不至于相差太大,所以引入了dip的概念。比如定义一个矩形10 x 10dip. 在分辨率为160dpi 的屏上,比如G1,正好是10 x 10像素。而在240 dpi 的屏,则是15 x 15 像素. 换算公式为 pixs = dips * (density/160). density 就是屏的分辨率
2023-07-16 14:06:502

如何获取 自动适应DIV 的高宽

代码如下:Util.getPOP = function(self, tar, wid) { console.log(tar.height());//此处永远获取到初始高度 var aTop = self.offset().top; var aLeft = self.offset().left; var aHeight = self.outerHeight(); var aWidth = self.outerWidth(); var tmpWidth = tar.width(); var tmpHeight = tar.height(); var tipY = $(window).height() - (aTop + tmpHeight); var tipX = $(window).width() - (aLeft + tmpWidth); var tmpTop = aTop; var tmpLeft = aLeft + aWidth / 2; var up = tar.find(".ar_up"); var upInner = tar.find(".ar_up_in"); if (self.hasClass("ToolTipCols")) { tmpWidth = tar.width() } else { if (tmpWidth > wid) { tmpWidth = wid; } else { tmpWidth = tar.width() } }; if (tipX < Util.ToolTip.x) { tmpLeft = tmpLeft - (tmpWidth - aWidth / 2) + 5; up.css({ left: "auto", right: "5px", marginLeft: "0" }); upInner.css({ left: "auto", right: "5px", marginLeft: "0" }) } else { if (tmpLeft < tmpWidth) { tmpLeft = tmpLeft - aWidth / 2 - 5; up.css({ left: "5px", marginLeft: "0" }); upInner.css({ left: "5px", marginLeft: "0" }) } else { tmpLeft = tmpLeft - tmpWidth / 2 } }; if (tipY < Util.ToolTip.y) { tmpTop = tmpTop - aHeight - tmpHeight; up.addClass("ar_down"); upInner.addClass("ar_down_in") } else { tmpTop = tmpTop + aHeight + 12; if (self.hasClass("ToolTipCols")) { upInner.css({ "border-color": "transparent transparent #e8ecef transparent" }) } }; tar.css({ position: "absolute", top: tmpTop, left: tmpLeft, width: tmpWidth, zIndex: Util.ToolTip.zindex }); tar.fadeIn("slow"); var tmpHeight = tar.height(); console.log(tmpHeight);//如果把高度定义在这里,就正常};Util.ToolTip = { //此处定义DIV,且调用,tar为自定义DIV Util.getPOP(self, tar, Util.ToolTip.wid);
2023-07-16 14:06:573