0

这个问题困扰了我很长时间,但我仍然找不到解决方案。

有谁知道如何在使用 jQuery Mobile 开发的移动版网站中动态调整视频(从 youtube/vimeo 等嵌入)和图像的尺寸。

我的场景是网站的移动版本从与主网站相同的数据库/表中提取内容,其中图像和视频比手持设备应该大得多。有小费吗?

4

2 回答 2

0

不要混合图像和视频调整大小问题。建议在服务器端(PHP/Python、C# 等)调整图像大小,以减少流量和更快地加载移动网站。视频可以在服务器端使用 FFMpeg 调整大小,如果视频来自外部托管(如 youtube),则以最低质量开始播放。

于 2013-01-18T13:55:47.340 回答
0

我写了这个函数:

/**
 * resize_embedded resizes embedded videos like youtube videos;
 * Examples: 
 *  - resize_embedded($('youtube_div'), 300, 200);
 *  - Fiddle: http://jsfiddle.net/xjxVC/1
 *
 * Parameters:
 * @param jquery the element that contains the embedded media
 * @param number the new width
 * @param number the new height
 *
 */
function resize_embedded(){

    // Did we receive 3 correct parameters
    if(arguments.length === 3 && $(arguments[0]).length && isNumber(arguments[1]) && isNumber(arguments[2])) 
        ;
    else
        return 0;

    // Clone embedded element
    $c = $(arguments[0]).clone();

    // Resize clone (replace width/height of all children who have them) 
    $c
        .attr('width', arguments[1])
        .attr('height', arguments[2])
        .children().each(function(){     
            $(this).attr('width') && $(this).attr('width', arguments[1]);
            $(this).attr('height') && $(this).attr('height', arguments[2]);
    })

    // Replace target with clone
    $(arguments[0]).replaceWith($c);
}

function isNumber(n){
    return !isNaN(parseFloat(n)) && isFinite(n);
}

演示:http: //jsfiddle.net/xjxVC/1

于 2013-01-18T15:58:37.757 回答