Javascript 为jquery图像缩放插件定义选择器

（编辑：我终于放弃了使用这个插件，使用了更简单、更直接的插件） 谢谢大家的帮助！！）

我在试着用这个

有人能帮我把follow null值改成名为“abc”的div类吗？还是我必须提供脚本的其余部分

(function ($) {
    $.fn.imageScale = function (params) {
        var _matched_elements = this;

        params = $.extend({
            /**
             * CSS selector used to get the image container against which the
             * image size will be calculated.
             *
             * Default to the image's immediate parent.
             */
            parent_css_selector: null,
            /**
             * Set to 'fit' or 'fill'. When set to 'fit', the image will scale
             * to fit inside it's parent container's bounds. When set to
             * 'fill', the image will fill it's parent container's bounds.
             */
            scale: 'fill',
            /**
             * Boolean. The image will automatically center itself if the
             * scale parameter is set to 'fill'. Set to false to disable this
             * feature. 
             */
            center: true,
            /**
             * Time in milliseconds. When set, images that are not already
             * cached by the browser will load hidden, then fade in. 0 to
             * disable.
             */
            fade_duration: 0,
            /**
             * Boolean. Whether to rescale images when the browser is resized.
             */
            rescale_after_resize: true
        }, params);

        parse_images(_matched_elements);
        if (params.rescale_after_resize) {
            $(window).resize(function () {
                parse_images(_matched_elements, true);
            });
        }

        function parse_images(images, skip_init) {
            images.each(function () {
                var image = $(this);
                if (params.parent_css_selector) {
                    var parent = img.parents(params.parent_css_selector);
                } else {
                    var parent = image.parent();
                }

                if (!skip_init) {
                    parent.css({
                        opacity: 0,
                        overflow: 'hidden'
                    });
                }

                if (parent.length) {
                    image.bind('load', function () {
                        scale_image(image, parent, params);
                    });
                    // Trigger load event for cache images.
                    var src = this.src;
                    // Webkit hack from http://groups.google.com/group/jquery-dev/browse_thread/thread/eee6ab7b2da50e1f
                    // Data uri bypasses webkit log warning (thx doug jones).
                    this.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
                    this.src = src;
                }
            });
        }

        function scale_image(image, parent, params) {
            image.removeAttr('width').removeAttr('height');
            image.css({
                'width': 'auto',
                'height': 'auto'
            });

            // Account for ancestors that are hidden to ensure we're getting
            // the correct sizes.
            var ancestor = image.get(0),
                hiddenAncestors = [];
            while (ancestor && ancestor.tagName != 'BODY') {
                if (ancestor.style.display == 'none') {
                    hiddenAncestors.push(ancestor);
                    ancestor.style.display = 'block';
                }
                ancestor = ancestor.parentNode;
            }

            var parent_width = parent.width(),
                parent_height = parent.height(),
                image_width = image.width(),
                image_height = image.height();

            resize_image();
            if (params.center) {
                reposition_image();
            }

            for (var i = 0; i < hiddenAncestors.length; i++) {
                hiddenAncestors[i].style.display = 'none';
            }

            show_image();

            function resize_image() {
                if (parent_width / image_width > parent_height / image_height) {
                    if (params.scale == 'fit') {
                        image.css('height', parent_height);
                    } else {
                        image.css('width', parent_width);
                    }
                } else {
                    if (params.scale == 'fit') {
                        image.css('width', parent_width);
                    } else {
                        image.css('height', parent_height);
                    }
                }
            }

            function reposition_image() {
                var new_width = image.width(),
                    new_height = image.height();

                image.css({
                    'margin-left': 0,
                    'margin-top': 0
                });

                if (new_width > parent_width) {
                    image.css('margin-left', '-' + Math.floor((new_width - parent_width) / 2) + 'px');
                }
                if (new_height > parent_height) {
                    image.css('margin-top', '-' + Math.floor((new_height - parent_height) / 2) + 'px');
                }
            }

            function show_image() {
                if (params.fade_duration > 0 && !image.get(0).complete) {
                    parent.animate({
                        opacity: 1
                    }, params.fade_duration);
                } else {
                    parent.css('opacity', 1);
                }
            }
        }

        return this;
    }
})(jQuery);

---

我猜您需要的是

parent\u css\u选择器：“abc”

如果您需要“.”，则假定它会显示为

parent\u selector

，而“abc”是DOM中图像的直接父级的类名。

这是：

沿着代码向上看，我们看到

images

是jQuery链，是一种jQuery方法，它表示当前匹配元素集中每个元素的祖先，可选地由选择器过滤

也就是说，如果没有HTML标记和选择器，应用插件是不可能回答您的问题的，但是这些信息应该是一个很好的起点

---

编辑：您似乎在定义DOM元素之前初始化插件。您可以将

标记移动到HTML下面，但常见的技术是让jQuery等待：

---

看起来你的父级css选择器只是被设计来获取“fit”或“fill”的值。我认为fit或fill是用于父级css选择器正下方的缩放选项！但是当我把它改为“abc”时，我得到一个错误，说“uncaughtreferenceerror:img未定义”，我不熟悉jquery语法，希望您能给我一些建议。我用完整的脚本修改了帖子，我想这意味着它找到了“abc”容器，但没有在容器中找到

元素。这不是一个真正的jquery问题，更多的是关于你正在使用的插件的API参考，你应该编辑你的问题，告诉我们你正在使用什么插件。也有可能是你在加载DOM之前启动了插件。我已经根据你的指导再次更新了帖子。学习如何恰当地提出问题和编码一样困难。但我正在学习：p

<script>
$('img').imageScale({
    parent_selector: '.abc', // Defaults to the image's immediate parent.
    scale: 'fill',
    center: true,
    fade_duration: 0, // Fading is disabled if set to 0.
    rescale_after_resize: true
});
</script>

<div id="wrapper">
  <div class="logo">
    <img src="logo.jpg" alt="" />
  <div class="abc">
    <img src="123.jpg" alt="" />
  </div>
</div>

function parse_images(images, skip_init) {
    images.each(function() {
        var image = $(this);
        if (params.parent_css_selector) {
            var parent = img.parents(params.parent_css_selector);
        }
        else {
            var parent = image.parent();
        }

jQuery(function($){
    $('img').imageScale({
        parent_selector: '.abc', // Defaults to the image's immediate parent.
        scale: 'fill',
        center: true,
        fade_duration: 0, // Fading is disabled if set to 0.
        rescale_after_resize: true
    });
});