2017-10-17 15 views
0

J'ai des images sur une page qui sont cliquables. Lorsque je l'essaie sur Safari Mobile, ils ne sont pas cliquables. Une chose que j'ai remarquée est que si je n'ai pas de pagination sur la page, je peux cliquer sur les images. Avant j'ai remarqué que j'ai essayé cette réponse Clickable Images not working on iPhone/Android, mais cela n'a pas aidé. Je remarque également que si j'appuie sur une image et la maintient enfoncée, c'est le lien de pagination qui est sélectionné.Les images ne sont pas cliquables lorsque la pagination est sur la page sur le mobile safari

J'utilise des rails. Voici mon point de vue partielle:

<% @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> 

Voici mon css pour la page:

/* Videos */ 

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

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

Répondre

0

Si je prends la classe col-md-12 sur la div enveloppant les liens de pagination, cela fonctionne. Quelque chose dans le bootstrap css est en train de tout bousiller.