jQuery-有关移动设备的特定说明

时间:2018-11-02 13:27:41

标签: jquery mobile

我是jQuery初学者,我需要一些帮助。我构建了一个脚本,当您滚动时,该脚本会在页面上产生粘性元素:

    static function getThumpnail($file){

    $THUMBNAIL_IMAGE_MAX_WIDTH  = 150; # exmpl.
    $THUMBNAIL_IMAGE_MAX_HEIGHT = 150;

    $src_size = filesize($file);
    $filename = basename($file);

    list($src_width, $src_height, $src_type) = getimagesize($file);
    $src_im = false;
    switch ($src_type) {
        case IMAGETYPE_GIF  : $src_im = imageCreateFromGif($file);  break;
        case IMAGETYPE_JPEG : $src_im = imageCreateFromJpeg($file); break;
        case IMAGETYPE_PNG  : $src_im = imageCreateFromPng($file);  break;
        case IMAGETYPE_WBMP  : $src_im = imagecreatefromwbmp($file);  break;
    }   
    if ($src_im === false) { return false; }

    $src_aspect_ratio = $src_width / $src_height;
    $thu_aspect_ratio = $THUMBNAIL_IMAGE_MAX_WIDTH / $THUMBNAIL_IMAGE_MAX_HEIGHT;

    if ($src_width <= $THUMBNAIL_IMAGE_MAX_WIDTH && $src_height <= $THUMBNAIL_IMAGE_MAX_HEIGHT) {
        $thu_width  = $src_width;
        $thu_height = $src_height;
    } elseif ($thu_aspect_ratio > $src_aspect_ratio) {
        $thu_width  = (int) ($THUMBNAIL_IMAGE_MAX_HEIGHT * $src_aspect_ratio);
        $thu_height = $THUMBNAIL_IMAGE_MAX_HEIGHT;
    } else {
        $thu_width = $THUMBNAIL_IMAGE_MAX_WIDTH;
        $thu_height = (int) ($THUMBNAIL_IMAGE_MAX_WIDTH / $src_aspect_ratio);
    }

    $thu_im = imagecreatetruecolor($thu_width, $thu_height);
    imagecopyresampled($thu_im, $src_im, 0, 0, 0, 0, $thu_width, $thu_height, $src_width, $src_height);

    $dst_im    = imagecreatetruecolor($THUMBNAIL_IMAGE_MAX_WIDTH,$THUMBNAIL_IMAGE_MAX_WIDTH);
    $backcolor = imagecolorallocate($dst_im,192,192,192);
    imagefill($dst_im,0,0,$backcolor);
    imagecopy($dst_im, $thu_im, (imagesx($dst_im)/2)-(imagesx($thu_im)/2), (imagesy($dst_im)/2)-(imagesy($thu_im)/2), 0, 0, imagesx($thu_im), imagesy($thu_im));
    imagedestroy($src_im);
    imagedestroy($thu_im);
    }

效果很好。

现在,在移动设备上,我想添加一些额外的说明,例如:

jQuery(document).ready(function () {  
var top = jQuery('#card').offset().top;
jQuery(window).scroll(function (event) {
var y = jQuery(this).scrollTop();
if (y >= top)
    jQuery('#card').addClass('fixed'),
    jQuery('#card').removeClass('fl-row-fixed-width'),
else
    jQuery('#card').removeClass('fixed'),
    jQuery('#card').addClass('fl-row-fixed-width');
    jQuery('#card').width(jQuery('#card').parent().width());
});
});

但是,我不知道该在哪里输入以及如何在我的函数中输入...

1 个答案:

答案 0 :(得分:1)

您的代码可能看起来像这样

jQuery(document).ready(function () {  
var top = jQuery('#card').offset().top;
jQuery(window).scroll(function (event) {
var y = jQuery(this).scrollTop();
if (y >= top)
    jQuery('#card').addClass('fixed'),
    jQuery('#card').removeClass('fl-row-fixed-width'),
else
    jQuery('#card').removeClass('fixed'),
    jQuery('#card').addClass('fl-row-fixed-width');
    jQuery('#card').width(jQuery('#card').parent().width());
});
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
    // do what you want to do in mobile device
    jQuery("#logo").remove()
}
});