2012-07-06 6 views
0

J'utilisais la copie de zclip à la fonction de presse-papiers avec succès jusqu'à ce que j'ai commencé à utiliser le cadre d'amorçage de Twitter de bootstrap. Maintenant, je n'arrive plus à utiliser zclip, est-ce que quelqu'un a une solution pour ça?zclip & twitter bootstrap: incompatibilité?

Quelques résultats des tests:

Voici comment j'utilise zclip:

$('.test').zclip({ 
     path:"{{ asset('bundles/yopyourownpoet/flash/ZeroClipboard.swf') }}", 
     copy: 'test', 
     afterCopy:function(){ 
      alert('The poem has been copied to the clipboard.'); 
     }, 
    }); 

Cela fonctionne très bien avec le code html suivant:

<div class='test'>test</div> 

Mais chaque fois que je tente d'utiliser une image, cela ne marche plus, la chose du flash n'apparaîtra pas:

<div class='test'><img src="{{ asset('bundles/yopyourownpoet/images/Star.png') }}" alt="Star" height="100" width="100" /></div> 

Cela fonctionnait bien avant que je commence à utiliser bootstrap ... Un indice pour utiliser zclip & bootstrap, et avoir le flash sur une image? Merci beaucoup.

Répondre

2

Eh bien, après beaucoup d'essais, je l'ai enfin fonctionné. Je devais revenir à zeroclipboard et ne plus utiliser zclip. Voici le code qui fonctionne:

<div id="d_clip_container" style="position:relative; bottom: 25px; display: inline;"> 
     <img id='d_clip_button' style="position:relative; top: 25px;" src="{{ asset('bundles/yopyourownpoet/images/CopyPoemPage8.png') }}" alt="Copy Poem" height="71" width="300" /> 
    </div> 

-

ZeroClipboard.setMoviePath("{{ asset('bundles/yopyourownpoet/flash/ZeroClipboard.swf') }}"); 
    var clip = new ZeroClipboard.Client(); 
    clip.setText('text to copy'); 
    clip.glue('d_clip_button', 'd_clip_container'); 
    clip.setHandCursor(true); 

Notez que je devais utiliser une astuce, 25px de fond sur le réservoir et 25px sur l'image, de sorte que la chose flash est superposé à l'image.

Cela fonctionne bien, sauf que le curseur n'est pas toujours changé en pointeur lors du survol de l'image.

Je pense que cette solution est un peu louche, donc si quelqu'un a une meilleure solution, partagez-la.