0

I have images on a page that are clickable. When I try it on Safari mobile they are not clickable. One thing I noticed is that if I do not have pagination on the page then I can click the images. Before I noticed that I did try this answer Clickable Images not working on iPhone/Android, but it did not help. I also notice that if I press and hold down on an image it is the pagination link that is being selected.

I am using rails. Here is my partial view:

<% @videos.each do |v| %>
    <div class="vidframe">
        <a href="<%= video_path(v) %>" data-remote="true"><%= image_tag v.thumbnail.url, alt: 'thumbnail:' + v.title,  title: v.title, class: 'vid-thumbnail'%></a>
    </div>
    <% if parent_mode? %>
        <div class="mngbuttons">
            <%= form_for(:video, url: video_path(v), method: :patch, remote: true) do |f| %>
                <%= f.hidden_field :approved, value: 'true' %>
                <%= f.submit "Approve", data: { confirm: 'Approve: Are you sure?' }, class: 'btn btn-primary mng-button' %>
            <% end %>
            <%= link_to "Delete", video_path(v), method: :delete, remote: true, data: { confirm: 'Delete: Are you sure?' }, class: 'btn btn-primary mng-button' %>
        </div>
    <% end %>
<% end %>
<div id="video_paginate" class="col-md-12">
    <% if parent_mode? %>
        <%= will_paginate @videos, params: { controller: 'static_pages', action: 'parent' } %>
    <% else %>
        <%= will_paginate @videos, params: { controller: 'static_pages', action: 'home' } %>
    <% end %>

</div>

Here is my css for the page:

/* Videos */

.vidframe, .mngbuttons {
  float: left;
  height: 92px;
  padding: 1px;
}

/* Make links work on Safari Mobile, hopefully */
.vid-thumbnail {
  cursor: pointer;
}
G Hall
  • 41
  • 10

1 Answers1

0

If I take out the class col-md-12 on the div wrapping the pagination links, it works. Something in bootstrap css is screwing things up.

G Hall
  • 41
  • 10