How to resize an HTML slider without CSS? - html

Question

I have a problem with my slider. When i use this page on mobile, the slider will be small. The slider is the first object on my page, and I would like it bigger. I know this would be better to do in CSS, but this is a plugin (with java), and I can't move it using CSS.
How do I make the slider bigger?
Here is my code:
<div id="slider1_container" style="position:relative;margin:0 auto;top:0px;left:0px;width:1300px;height:640px;overflow:hidden;">
<div data-u="loading" style="position:absolute;top:0px;left:0px;">
<div style="filter:alpha(opacity=70);opacity:0.7;position:absolute;display:block;top:0px;left:0px;width:100%;height:100%;">
</div>
<div style="position:absolute;display:block;background:url(images/loading.gif) no-repeat center center;top:0px;left:0px;width:100%;height:100%;">
</div>
</div>
<div data-u="slides" style="cursor:move;position:absolute;left:0px;top:0px;width:1300px;height:640px;overflow:hidden;">
<div>
<img data-u="image" src="images/slide1.jpg" alt="">
<div data-u="caption" data-t="NO" data-t3="RTT|2" data-r3="137.5%" data-du3="3000" data-d3="500" style="position:absolute;width:445px;height:300px;top:100px;left:600px;">
</div>
<div data-u="caption" data-t="RTT|2" data-r="-75%" data-du="1600" data-d="2500" data-t2="NO" style="position:absolute;width:470px;height:220px;top:120px;left:650px;">
</div>
</div>
<div>
<img data-u="image" src="images/slide2.jpg" alt="">
</div>
<div>
<img data-u="image" src="images/slide3.jpg" alt="">
</div>
</div>
<div data-u="navigator" class="jssorb21">
<div data-u="prototype"></div>
</div>
<span data-u="arrowleft" class="jssora21l">
</span>
<span data-u="arrowright" class="jssora21r">
</span>
<a style="display:none" href="http://www.jssor.com">Bootstrap Slider</a>
</div>
<script>
jssor_slider1_starter('slider1_container');
</script>

Answer 1

Put the width on 100% and height on auto or leave it at 640px