zclip и twitter bootstrap: несовместимость?

Я успешно использовал функцию копирования zclip в буфер обмена, пока не начал использовать фреймворк twitter bootstrap css. Теперь я больше не могу использовать zclip, есть ли у кого-нибудь решение для этого?

Некоторые результаты теста:

Вот как я использую zclip:

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

Это отлично работает со следующим html:

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

Но всякий раз, когда я пытаюсь использовать изображение, оно больше не работает, вспышка не появляется:

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

Это отлично работало до того, как я начал использовать загрузку ... Есть ли какой-нибудь намек на использование zclip и bootstrap, а также на флэш-память над изображением? Большое спасибо.


twitter-bootstrap zclip
person fkoessler    schedule 06.07.2012    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Ну, после многих попыток, у меня, наконец, это работает. Мне пришлось вернуться к нулевому буферу обмена и больше не использовать zclip. Вот код, который работает:

    <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 );

Обратите внимание, что мне пришлось использовать трюк: нижние 25 пикселей на контейнере и верхние 25 пикселей на изображении, чтобы вспышка накладывалась на изображение.

Это работает хорошо, за исключением того, что курсор не всегда меняется на указатель при наведении на изображение.

Я думаю, что это решение немного сомнительное, поэтому, если у кого-то есть лучшее решение, поделитесь им.

person fkoessler    schedule 08.07.2012