qTip2翻转缩略图显示全尺寸图像

时间:2012-11-27 06:56:23

标签: jquery replace qtip2

我正在使用qTip2和我的Umbraco安装。我希望将我的图像插入到富文本编辑器中以在翻转时显示完整大小的图像。

问题是,Umbraco的富文本编辑器显示小于完整大小的图像。适合富文本编辑器的宽度。因此,在前端上显示的图像具有例如添加'_360x200.jpg'代替'.jpg'

如何更换下划线及其后的所有内容,直至完整停止/期间?

    // Create the tooltips only on document load
    $(document).ready(function() {
        $('.rightUnevenCol img').each(function() {
            // Grab fullsize image src
//Replace the underscore and everything after it before the '.' e.g. '_320x200.jpg' to '.jpg'
            var bigSrc = $(this).attr('src').replace(/_\d+$/, "");
            $(this).qtip({
                content: '<img src="' + bigSrc + '" alt="" />',
                // Set the height/width!!! This can cause positioning problems if not set
                position: {
                    target: 'mouse',
                    adjust: {
                        mouse: true
                    }
                },
                show: {
                    target: false,
                    event: 'mouseenter',
                    effect: true,
                    delay: 90,
                    solo: false,
                    ready: false,
                    modal: false
                },
                hide: {
                    target: false,
                    event: 'mouseleave',
                    effect: false,
                    delay: 0,
                    fixed: true,
                    when: {
                        event: 'unfocus'
                    },
                    inactive: false
                },
                style: {
                    tip: false,
                    classes: 'preview'
                },
                events: {
                    render: null,
                    move: null,
                    show: null,
                    hide: null,
                    toggle: null,
                    focus: null,
                    blur: null
                }
            });
        });

        // since the qTip copies the content of the info div, you can remove it now
        $('.rightUnevenCol img').remove('.preview');


    });​

1 个答案:

答案 0 :(得分:1)

尝试

var bigSrc = $(this).attr('src').replace(/_[^\.]*/, "");

或者如果您确定格式为123x456

var bigSrc = $(this).attr('src').replace(/_\d{1,3}x\d{1,3}/, "");