草庐IT

animation_img

全部标签

javascript - 可靠地检测 <img> 标签对 SVG 的支持

我目前正在对网站进行一些重新设计,基本上只是将其升级到更新的外观并尝试使其尽可能独立于分辨率,以独立于分辨率的名义我想我会尝试在浏览器支持SVG图像的设计中使用SVG图像标签。我想在中坚持只使用SVG的原因标签而不是使用一些更雄心勃勃的解决方案是AFAIKChrome、Opera和Safari都支持它,而FF4似乎最终可能会得到它以及整个网站建立在自定义CMS上的事实必须部分重写以开始更改输出HTML(目前它支持自定义设计图像、自定义CSS和自定义JS,包括每个主题)。现在,我自己在网上浏览了一下,试图找出执行此操作的最佳方法,出于某种原因,我发现几乎所有建议的解决方案都效果不佳(其中

javascript - 使用 img 标签加载不受信任的 SVG 时的 XSS

使用img加载不受信任的SVG文件时是否存在XSS威胁?标签?如:我读到大多数浏览器在通过img加载的svg文件中禁用脚本标签。 最佳答案 这曾经在某些浏览器中有效,但现在不行了。但是有一个相关的问题。如果我作为一个不知情的用户,右键单击并下载图像,然后在本地打开它,它很可能会在浏览器中打开并运行脚本。考虑到它是一张图片,这有点奇怪。我想如果您右键单击并选择“查看图像”也可能导致脚本运行,因为您直接打开了它。 关于javascript-使用img标签加载不受信任的SVG时的XSS,我们在

javascript 检查 img src 是否有效?

这个问题在这里已经有了答案:jQuery/JavaScripttoreplacebrokenimages(32个答案)关闭9年前。我有这样的东西:document.getElementById('MyPicture').src='attempted.png';如果客户端无法获取该资源,我想将其替换为:document.getElementById('MyPicture').src='error.png'我知道我可以将onError=function()放在图像标签中,但是我如何将Id传递给onError,这样我就可以拥有一个可以更改任何不良图片的src的onError函数?

javascript - jQuery animate() 通过左右滑动来隐藏和显示元素

我正在尝试使用jQuery制作动画。更新我让它按照我想要的方式工作。这是jQuery:$(document).ready(function(){//gochatbutton$('#go-chatinput').click(function(){$('#search,#go-chat').animate({width:'0px'},1000,function(){$(this).hide();$('#login,#go-search').animate({width:'573px'},1000,function(){$(this).show();});});});$('#go-searc

Javascript onclick 函数传递 img src

我有3个图像,每个图像都有一个onclick和一个传递的参数。这是HTML:我需要做的是有一个函数来获取myfunction传递参数的imgsrc值。例如:myFunction(id){$('body').html(/*passedparameter'simgsrchere*/);}我该怎么做? 最佳答案 您可以将this作为参数传递给函数,该函数将引用被单击的div元素。然后您可以获得子img并读取src属性。然而,更好的解决方案是使用不显眼的事件处理程序,而不是过时的on*事件属性。试试这个:$('.thumbnail').cl

javascript - 此警告消息是什么意思? 'img elements must have an alt prop, either with meaningful text, or an empty string for decorative images'

为什么我会收到此警告?warning:imgelementsmusthaveanaltprop,eitherwithmeaningfultext,oranemptystringfordecorativeimagesjsx-a11y/img-has-alt它显示第13行,但没有使用任何Prop。 最佳答案 这意味着当您在HTML中创建图像时,为了屏幕阅读器和文本浏览器的利益,您应该包含一个alt属性。 关于javascript-此警告消息是什么意思?'imgelementsmusthave

javascript - jQuery Animate 顶部(从底部到顶部)

我正在尝试为top:275的Div设置动画。我尝试了.animate({marginTop:-820}但在每个屏幕上它最终都到达了不同的位置......所以我将marginTop更改为.animate({top:275}但是div从上到下(slidedown)。注意,所以我可以使用animate:top我必须在动画期间将div设置为position:absolute。。。是否有任何hackyway使顶部从下到上或使marginTop在每个屏幕分辨率上与顶部的距离相同?(我认为margintop无法解决,因为我将margintop设置为-820以获得top:275,因此高度小于1200p

javascript - 拉斐尔 JS : how to move/animate a path object?

不知怎的,这行不通......varpaper=Raphael("test",500,500);vartestpath=paper.path('M100100L190190');vara=paper.rect(0,0,10,10);a.attr('fill','silver');a.mousedown(function(){testpath.animate({x:400},1000);});我可以用这种方式move矩形但不能move路径,这是为什么,然后我该如何move路径对象?! 最佳答案 使用最新版本的Raphael,您可以这样

javascript - <img> onerror 404 图像响应

我正在从服务器加载图像,当存在404时返回图像。也就是说,如果我正在加载的图像不存在,服务器将返回404响应和200x200PNG后备图像,说上面写着“照片不可用”。我想检测客户端发生这种情况的时间。我尝试了onerror属性:此代码仅在服务器的404响应根本没有图像时有效。由于我的404响应确实如此,因此永远不会触发onerror事件。除了使用JavaScript预加载图像之外,是否有解决此问题的方法? 最佳答案 (已更新,@Brad指出了我不知道的明显细节。)我偶然发现了this这似乎正确地触发了onerror():(funct

javascript - jquery "animate"变量值

我需要用jquery来“动画化”一个变量。示例:变量值为1。5秒后该值应为10。它应该“平稳”地增加。希望你明白我的意思。谢谢! 最佳答案 尝试:$({someValue:0}).animate({someValue:10},{duration:5000,step:function(){$('#el').text(Math.ceil(this.someValue));}}); 关于javascript-jquery"animate"变量值,我们在StackOverflow上找到一个类似的