如何更改JavaScript库中更改图像的大小?

时间:2019-04-16 12:01:52

标签: javascript php wordpress image-gallery

我正在为我的WordPress网站制作一个新的自定义插件,该插件使用短代码显示图片库:

[galleryplugin]

该插件使用PHP和JavaScript。 从本质上讲,我希望短代码显示图库,但确实如此,但是我需要图像大小相同。我试图用<div>制作一个特定的size = height:"100px";width:"50px"标签,但是这样做的时候:

  1. 图像(我认为)没有达到这样的大小
  2. “下一个”功能(损坏的图像按钮)不会将图像移至下一个图像

有人知道如何解决此问题吗? 谢谢您的提前答复!

代码 PHP:

<?php
/**
 * Plugin Name: Eddie's Tech Gallery
 * Description: Custom gallery plugin by Eddie's Tech
 * Version: 1.0
 * Author: Eddie's Tech
 * Author URI: https://www.eddiestech.co.uk
 */


function load_js() {
 if (is_front_page()) {
     wp_enqueue_script( 'gallery', plugins_url( '/gallery.js', __FILE__ ),array(),time());
 } 
}
add_action('wp_enqueue_scripts','load_js');

add_shortcode('galleryplugin', 'shortcode');
function shortcode() {
    ?>
    <br />
        <img id="whiteBox" src="/wp-content/plugins/gallery/imgs/img1.png"></img>
        <a href="#" onclick="next();return false;"><img src="next.png"/></a>
    <br />
    <?
}
?>

代码 JS:

var myImage= new Array(); 
myImage[0]="/wp-content/plugins/gallery/imgs/img1.png";       
myImage[1]="/wp-content/plugins/gallery/imgs/img2.png";
myImage[2]="/wp-content/plugins/gallery/imgs/img3.png";

var ImageCnt = 0;

function next(){
    ImageCnt++;

    ImageCnt %= myImage.length

    document.getElementById("whiteBox").src = myImage[ImageCnt];
  }

0 个答案:

没有答案