Jquery改变背景大小和图像src

Jquery change background size AND image src

本文关键字：图像 src 改变 背景 Jquery      更新时间：2023-09-26

我正在尝试改变background-image和background-size(所以它适合div)

$(".clickableimg").click(function() {
    var choosenpic = $(this).attr('id');
    $("#image").val(choosenpic);
    $("#preview").css("background","url(backgrounds/"+choosenpic+")");
    $("#preview").css("background","size('50%')");
});

你知道我怎么能改变更多的css属性吗?

设置两次背景样式会覆盖它，所以只有最后一个会坚持，你需要使用有效的CSS属性，如background-image和background-size分别更改它们:

$(".clickableimg").on('click', function() {
    var choosenpic = this.id;
    $("#image").val(choosenpic);
    $("#preview").css({
        'background-image' : 'url(backgrounds/'+choosenpic+')',
        'background-size'  : '50%'
    });
});

我不完全确定你的代码工作正确，因为我认为你的意思是

  $("#preview").css("background-image","url(backgrounds/"+choosenpic+")");

但如果你已经有工作，那么干杯。

你可以改变任何css属性，只要它被浏览器支持。

  $("#preview").css("display", "none")
  $("#preview").css("width", "5000px")
  $("#preview").css("text-shadow", "...")
  $("#preview").css("box-shadow", "...")
  $("#preview").css("border", "...") ..

我可以继续写下去，但这里有一些CSS3的属性，你可以使用

http://www.quackit.com/css/css3/properties/

首先，如果你是javascript新手，你应该先看看javascript是如何基本工作的，然后再开始学习像jQuery这样的框架。根据你的问题，下面的jquery插件应该可以帮助你完成你的任务:https://github.com/louisremi/background-size-polyfill

相关文章：