I really like your index page image slider on desktop and mobile, but on my iPad mini it has a large empty gray area under the image before section 2.
My current image slider does not do that, but it lacks the functionality that you have built into the iSkin4 image slider... plus my slider does not look nearly as nice on mobile. Do you think a middle point @media css option would be possible for the iSkin4 to look nice on tablets? Or is there a way to use the responsive ability of my image slider in the iSkin4 until it hits mobile size?
Here is the code I am using:
<script type="text/javascript">
$(function () {
$("#index_slider").responsiveSlides({
auto: true, // Boolean: Animate automatically, true or false
speed: 400, // Integer: Speed of the transition, in milliseconds
timeout: 6000, // Integer: Time between slide transitions, in milliseconds
pager: false, // Boolean: Show pager, true or false
random: false, // Boolean: Randomize the order of the slides, true or false
pause: true, // Boolean: Pause on hover, true or false
maxwidth: 1920, // Integer: Max-width of the slideshow, in pixels
namespace: "rslides" // String: change the default namespace used
});
});
</script>
<div id="cbp-fwslider" class="cbp-fwslider">
<ul id="index_slider">
<li><a href="https://schoolhouse.assemble-together.org/" target="_blank"><img src="https://assemble-together.org/image/img/skin/atEZtree/SchoolHouse_Slide.jpg" alt="LEARN"/></a></li>
<li><a href="https://assemble-together.org/user/signup"><img src="https://assemble-together.org/image/img/skin/atEZtree/Love_Slide.jpg" alt="LOVE"/></a></li>
<li><a href="https://assemble-together.org/genealogy"><img src="https://assemble-together.org/image/img/skin/atEZtree/Life_Slide.jpg" alt="LIFE"/></a></li>
</ul>
</div>
--
The Patria Company - patriaco.com / quality-trades.com / a-t.life - doing Jamroom since v3
updated by @the-patria-company: 10/11/16 01:19:30PM