我写了一些jquery/php来重新加载图像在我的wordpress主题窗口调整大小。它加载随机代码,然后崩溃。任何想法都欢迎。 谢谢。在Wordpress中重新加载不同大小的图像
PHP
function head_scripts() {
if (!is_admin()) {
wp_localize_script('init', 'theme_info', array('ajax' => admin_url('admin-ajax.php')));
}
} add_action('init', 'head_scripts');
function image_echo($size, $i_ID) {
$image_attr = wp_get_attachment_image_src(get_post_thumbnail_id($i_ID), $size);
?><img itemprop="image" class="ajax-resize" attachment-id="<?php echo get_post_thumbnail_id ($i_ID) ?>" src="<?php echo $image_attr[0]; ?>" width="<?php echo $image_attr[1]; ?>" height="<?php echo $image_attr[2]; ?>" alt="<?php echo get_the_title($i_ID); ?>"/><?php
}
function resize_ajax_image() {
if(isset($_POST['image_size'])) {
$image_size = $_POST['image_size'];
}
if(isset($_POST['attachment_id'])) {
$attachment_id = $_POST['attachment_id'];
}
image_echo($image_size, $attachment_id);
die();
} add_action('wp_ajax_nopriv_resize_ajax_image', 'resize_ajax_image');
add_action('wp_ajax_resize_ajax_image', 'resize_ajax_image');
jQuery的
$(document).ready(function() {
function find_ajax_images(imageSize) {
$('.ajax-resize').each(function(){
var attachmentID = parseInt($(this).attr('attachment-id'));
$.ajax(
theme_info.ajax,{
type: 'POST',
cache: false,
data: {
action: 'resize_ajax_image',
image_size: imageSize,
attachment_id: attachmentID
},
success: function(resizeImage){
$(this).html(resizeImage);
}
});
});
}
function fixImages() {
var winHeight = $(window).height();
var winWidth = $(window).width();
if (winWidth < 800) {
//$('body').css('background-color','red');
find_ajax_images('mobile');
} else if (winWidth < 1024) {
//$('body').css('background-color','yellow');
find_ajax_images('small_1024');
} else if (winWidth < 1280) {
//$('body').css('background-color','green');
find_ajax_images('medium_1280');
} else if (winWidth < 1440) {
//$('body').css('background-color','white');
find_ajax_images('medium_1440');
} else if (winWidth < 1680) {
//$('body').css('background-color','magenta');
find_ajax_images('large_1680');
} else { // > 1680
//$('body').css('background-color','brown');
find_ajax_images('large_1920');
} //nested if
}
$(window).bind('resize', function() {
fixImages();
});
});
尝试从发布编码块,说不要。怎么样它崩溃?客户端,服务器端,浏览器崩溃?如果在PHP中,你可以打开错误报告,让我们知道会发生什么?如果在JavaScript中,它在哪一行崩溃? etc. – mrtsherman
我建议你不要在这里使用ajax,只需要改变调整大小的图像src到像img.php?img.jpg&size = large1024; –
和别人的人....我个人喜欢那种风格 –