Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 增加div按钮的大小_Javascript_Jquery_Html_Css - Fatal编程技术网

Javascript 增加div按钮的大小

Javascript 增加div按钮的大小,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我正在创建一个图像幻灯片,需要帮助增加幻灯片中onclick按钮(类“左”和“右”)的大小 代码如下: HTML: <div id="coasters"> <div class="content"> <img class="img" src="coasters1.jpg" style="width:100%"> <img class="img" src="coasters2.jpg" style="width:100%"> <img clas

我正在创建一个图像幻灯片,需要帮助增加幻灯片中onclick按钮(类“左”和“右”)的大小

代码如下:

HTML:

<div id="coasters">
<div class="content">
<img class="img" src="coasters1.jpg" style="width:100%">
<img class="img" src="coasters2.jpg" style="width:100%">
<img class="img" src="coasters3.jpg" style="width:100%">
<div class="left" onclick="plusDivs(-1)">&#10094; </div>
<div class="right" onclick="plusDivs(1)">&#10095;</div>
</div>
</div>  
var slideIndex = 1;
showDivs(slideIndex);

function plusDivs(n) {
showDivs(slideIndex += n);}

function currentDiv(n) {
showDivs(slideIndex = n);}

function showDivs(n) {
var i;
var x = document.getElementsByClassName("img");
var dots = document.getElementsByClassName("demo");
if (n > x.length) {slideIndex = 1}    
if (n < 1) {slideIndex = x.length}
for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";  }

for (i = 0; i < dots.length; i++) {
    dots[i].className = dots[i].className.replace(" white", "");}

x[slideIndex-1].style.display = "block";  
dots[slideIndex-1].className += " white";}
.coasters {
    position:relative;
    width: 100%;
    height: 100%;
    background: #e8e8e8;
}

.img {
    display:none;
    position:relative;
    margin-left:50%;
    width:100%;
    height:auto;
}

.left {
    position:relative;
    left: 50%;
    cursor:pointer;
    float:left;
}

.right {
    position: relative;
    left:50%;
    cursor:pointer;
    float:right;
}

.content{
    width:50%;
    height:auto;
}

我已尝试向其添加宽度和高度,但它没有变大。您需要了解您在此处设置的元素的高度/宽度。您的左右按钮位于
div
元素中。因此,如果指定高度和宽度,这将影响整个
div
,而不是其内容


这里的按钮实际上是文本。因此,您需要指定
字体大小
。看这里。注意左右按钮的大小差异,然后注意CSS。
.left
字体大小越大,因此看起来越大。

您需要了解您在此处设置的元素的高度/宽度。您的左右按钮位于
div
元素中。因此,如果指定高度和宽度,这将影响整个
div
,而不是其内容


这里的按钮实际上是文本。因此,您需要指定
字体大小
。看这里。注意左右按钮的大小差异,然后注意CSS。
.left
字体大小更大,因此看起来更大。

我在函数中又添加了一个参数

<div class="left" onclick="plusDivs(-1,$(this))">&#10094; </div>
<div class="right" onclick="plusDivs(1,$(this))">&#10095;</div>

希望对您有所帮助。

我在您的函数中又添加了一个参数

<div class="left" onclick="plusDivs(-1,$(this))">&#10094; </div>
<div class="right" onclick="plusDivs(1,$(this))">&#10095;</div>
希望对你有帮助