Рабочий пример может выглядеть так:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Save to Drive</title>
<style type="text/css">
#_img_{display: block; width: 120px; height: 160px; margin-bottom: 8px;}
#___savetodrive_0 iframe{width: 100px !important;}
</style>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
</head>
<body>
<img id="_img_" src="che_333x250.jpg" />
<div class="g-savetodrive"
data-src="//googledrive.com/host/0B0YcK5KeNe1tczZ1RVJEcUhEZ3M/che_333x250.jpg"
data-filename="Мой супер файл.jpg"
data-sitename="Мой супер сайт">
</div>
</body>
</html>
После загрузки страницы:
После наведения курсора:
После загрузки файла:
Обращаю внимание на строку css-стиля, содержащую инструкцию !important. Таким образом можно задать кнопке необходимый размер.
Если в английском варианте кнопка "Save" выглядит нормально по умолчанию, то в русском "Сохранить" не помещается в стандартный размер 57px. Поэтому без подобного "костыля" не обойтись.
Комментариев нет:
Отправить комментарий
Комментарий будет опубликован после модерации