Question

想要在jquery中更改类owl-item的宽度。怎么做。请帮助。

请参阅链接

我需要减少框中的width。请建议

我正在添加javascript供您参考： -

请参阅JS代码，以便我们了解： -

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/owl.carousel.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var owl = $("#owl-demo"),
            status = $("#owlStatus");
        owl.owlCarousel({
            navigation: true,
            afterAction: afterAction
        });
        function updateResult(pos, value) {
            status.find(pos).find(".result").text(value);
        }
        function afterAction() {
            updateResult(".owlItems", this.owl.owlItems.length);
            updateResult(".currentItem", this.owl.currentItem);
            updateResult(".prevItem", this.prevItem);
            updateResult(".visibleItems", this.owl.visibleItems);
            updateResult(".dragDirection", this.owl.dragDirection);
        }
    });
    $(document).ready(function () {
        var owl = $("#owl-demo1"),
            status = $("#owlStatus1");

        owl.owlCarousel({
            navigation: true,
            afterAction: afterAction
        });

        function updateResult(pos, value) {
            status.find(pos).find(".result").text(value);
        }

        function afterAction() {
            updateResult(".owlItems", this.owl.owlItems.length);
            updateResult(".currentItem", this.owl.currentItem);
            updateResult(".prevItem", this.prevItem);
            updateResult(".visibleItems", this.owl.visibleItems);
            updateResult(".dragDirection", this.owl.dragDirection);
        }

    });
</script>

Answer 1

你可以得到这样一个类的所有元素：

   $('.owl-item').css('width', '200px'); //Choose whichever new width you want

如果您需要特定的属性，则需要指定id属性并专门使用$('#elementID')...

选择该属性

Answer 2

使用：

    $(document).ready(function(){
        $('.owl-item').css('width','300px');
    });

你需要将jquery放在$（document）.ready block

中

Answer 3

// only did first because `.owl-item` is a class. if more targeted selection is needed, use an ID instead
var $el = $('.owl-item:first'),
    elW = $el.width();

function reduceWidthOfOwlItemFuntion(amt) {
    elW -= amt;
    $el.width(elW);
}

Answer 4

你想在页面加载时使用onclick功能吗？什么？请更具体地满足您的需求。

 <script>
    $(".owl-item").css({width: '100'});
 </script>

为什么你不能用CSS设置宽度？

将“100”更改为所需的px宽度。在页面的任何位置，在js文件中添加它等。确保通过外部链接或根目录中安装了jQuery库

通过JQuery减少宽度

4 个答案: