orbit-4-2/app/views/front/show_banner.html.erb

<div style='position:relative'>
  <div id='slideshow-<%= @ad_banner.title.dehumanize %>' class="orbit-cycle-slideshow"  data-cycle-timeout="<%= @ad_banner.timeout_millisecond %>" data-cycle-fx="<%= @ad_banner.ad_fx %>" data-cycle-pager=".banner_nav_<%= @ad_banner.title.dehumanize %>" data-cycle-pager-template="<li class='needed'><a href='#'></a></li>" data-cycle-pager-active-class="activeSlide" data-cycle-random='true' style="z-index: 0">
    <% @ad_banner.ad_images.can_display.each do |ad_image| %>
      <% link = ad_image_link(ad_image) %>
      <%= image_tag ad_image.file, alt: ad_image.title, title: ad_image.title, width: @ad_banner.width, height: @ad_banner.height, link_open: ad_image.link_open, link_url: link, style: "display:none; #{'cursor:pointer;' if link.present?}" %>
    <% end %>
  </div>
  <ul class='clear banner_nav banner_nav_<%= @ad_banner.title.dehumanize %>'></ul>
</div>

<script>
  $(function(){
    if($("#slideshow-<%= @ad_banner.title.dehumanize %> img").length > 1){    
      var a = [];
      <% @ad_banner.ad_images.can_display.each do |image| %>
        a.push("<%= image.file.url %>");
      <% end %>
      $.preload(a, 2, function(){
        $('.orbit-cycle-slideshow').cycle();
        var lis = $("ul.banner_nav_<%= @ad_banner.title.dehumanize %> li");
        if( lis.length > a.length ){
          for( i = lis.length - 1; i > a.length - 1; i-- ){
            lis[i].remove();
          }
        }
      });
    }
    else{
      $("#slideshow-<%= @ad_banner.title.dehumanize %> img").show()
    }
  });
</script>