jquery - 合并屏幕宽度上的两个类

当屏幕小于480px时，我想合并两个类。因此需要将两个类合而为一，以便将文本合并为1行。 JSfiddle在这里：http://jsfiddle.net/rMd9T/1/

这是我的HTML：

<p class="latestworktitle">Shazam</p><p class="latestworktitle2">Redesign</p>

这是我目前无法使用的Jquery：

jQuery(function($) {

var $window = $(window),
width;

function mergeprojectitles() {
    width = $window.width();
    if ( width < 480 ) return;
    $('.latestworktitle').last().html( $('.latestworktitle').last().html() + ' ' + $('.latestworktitle2').last().html());
    $('.latestworktitle2').remove();
    }
    mergeprojectitles();
});

那我在做什么错？提前致谢！

问候，

伍特

最佳答案

您需要将函数包装在调整大小处理程序中：

$(window).on('resize',function(){
//your code here
});

完整代码：

jQuery(function($) {
$(window).on('resize',function(){
var $window = $(window),
width;

function mergeprojectitles() {
    width = $window.width();
    if ( width < 480 ) return;
    $('.latestworktitle').last().html( $('.latestworktitle').last().html() + ' ' + $('.latestworktitle2').last().html());
    $('.latestworktitle2').remove();
    }
    mergeprojectitles();
});
});

关于jquery - 合并屏幕宽度上的两个类，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23010136/