а в валидном варианте это возможно?

Алексей

16 февраля 2011, 18:04

html5 еще не существует (официально)

как возможно подключить кнопки не используя подобный бред data-yashareType='link' data-yashareQuickServices='yaru,vkontakte,facebook,twitter,odnoklassniki,moimir'

или же как заставить работать при загрузке данного фрагмента

аяксом

27 комментариев

Авторизуйтесь, чтобы оставить комментарий

doochik

19 января 2016, 09:36

аяксом никак, блоки .yashare-auto-init ищутся после domcontentloaded
используйте обычный конструктор Ya.share()

Алексей

19 января 2016, 09:36

у меня на сайтах страницы аяксом собираются, а включать в html код не валивные фрагменты нет ни когого желания - скрипты перестанут корректно работать

Алексей

19 января 2016, 09:36

спасибо, вроде заработало с конструктором Ya.share()

P.S. зачем было изначально писать с использованием html5, его же еще нет и непонятно когда он будет?

doochik

19 января 2016, 09:36

мне непонятно зачем нужна валидация )

Алексей

19 января 2016, 09:36

1. гарантия корректной работы скриптов и сайта во всех популярных браузерах
2. неспособность написать валидный код, всего лишь говорит о уровне програмиста/верстальщика :-)

doochik

19 января 2016, 09:36

валидация - не гарантия правильного отображения, а всего лишь проверка синтаксиса. Яркий пример - это IE. А html5 data-атрибуты валидны с точки зрения синтаксиса.

Алексей

19 января 2016, 09:36

гарантия (если конечно не брать совсем уж древние версии), вопрос в кривезне рук :)
если страница собирается js, то лишние элементы в коде только осложняют работу

сколько сайтов имеют доктайп html5?

doochik

19 января 2016, 09:36

какая разница? с точки зрения html все валидно, неизвестные атрибуты игнорируются

Алексей

19 января 2016, 09:36

как раз с точки зрения html и не валидно :)
неизвестные атрибуты должен игнорировать браузер, а не валидатор при явно указанном DOCTYPE :)

Анатолий

19 января 2016, 09:36

Подскажите, пожалуйста, как всё таки правильно вставить Яндексовский скрипт "Поделиться", чтобы Валидор на него не ругался.

Алексей

19 января 2016, 09:36

в html коде страницы, там где должна быть кнопка:

<div id='ya_share1'>&nbsp;div>

в <head>:
<script type="text/javascript" src="http://yandex.st/share/share.js" charset="utf-8">script>
+ ссылка на ваш скрипт который подключен к данной странице

в вашем скрипте при получении браузером DOM следует вызвать функцию Social();

function Social() {
    new Ya.share({
        element: 'ya_share1',
            elementStyle: {
                'type': 'button',
                'quickServices': ['yaru', 'twitter', 'vkontakte', 'facebook']
            },
            popupStyle: {
                blocks: {
                    'Поделитесь с друзьями!': ['yaru', 'twitter', 'vkontakte', 'facebook', 'lj', 'moikrug', 'moimir', 'friendfeed', 'odnoklassniki']
                },
                copyPasteField: true
            }
});
};

P.S. у меня подключена библиотека jquery

Анатолий

19 января 2016, 09:36

у меня вся страница на простом HTML-е и к ней не подключены никакие скрипты и DOM я даже не в курсе что это... :)

подскажите, пожалуйста, что нужно в HTML коде поменять, чтобы валидатор перестал ругаться на http://nanuka.ru/index.html

Алексей

19 января 2016, 09:36

скрипты подклбчены :)

вместо

<script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8">script> <div class="yashare-auto-init" data-yashareL10n="ru" data-yashareType="none" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,moikrug">div>

поставте 
<div id='ya_share1'>&nbsp;div>

в 
там где стоит
<script type="text/javascript" src="script.js">script>
добавте
<script type="text/javascript" src="http://yandex.st/share/share.js" charset="utf-8">script>


в вашем скрипте script.js

добавте функцию которую я писал выше

в начале скрипта вызовите её 
Social();

Анатолий

19 января 2016, 09:36

валидотор не ругается, но и иконки соц. сетей не отображаются :(

посмотрите плиз, что не так http://nanuka.ru/index.html http://nanuka.ru/script.js ?

не совсем понял где именно нужно прописать вызов функции social

Алексей

19 января 2016, 09:36

наверно так вам будет проще:
добавте в 
<script type="text/javascript" src="http://yandex.st/jquery/1.6.2/jquery.min.js" type="text/javascript">script>

(это библиотека jquery)

в 
http://nanuka.ru/script.js добавте (в самом конце)

function Social() {
    new Ya.share({
        element: 'ya_share1',
            elementStyle: {
                'type': 'button',
                'quickServices': ['yaru', 'twitter', 'vkontakte', 'facebook']
            },
            popupStyle: {
                blocks: {
                    'Поделитесь с друзьями!': ['yaru', 'twitter', 'vkontakte', 'facebook', 'lj', 'moikrug', 'moimir', 'friendfeed', 'odnoklassniki']
                },
                copyPasteField: true
            }
});
};

jQuery(document).ready(function(){
Social();
});


пример как это реализованно можно посмотреть на http://www.allave.ru/

Анатолий

19 января 2016, 09:36

всё сделал, как сказали. не работает. (кнопки доб. в соц. сети не видны). :((

Алексей

19 января 2016, 09:36

поправте строчку:

<script type="text/javascript" src="http://yandex.st/jquery/1.6.2/jquery.min.js" type="text/javascript">script>
должно буть
<script type="text/javascript" src="http://yandex.st/jquery/1.6.2/jquery.min.js">script>
(это я ошибся)

и в вашем файле http://nanuka.ru/script.js

нет
function Social() {
    new Ya.share({
        element: 'ya_share1',
            elementStyle: {
                'type': 'button',
                'quickServices': ['yaru', 'twitter', 'vkontakte', 'facebook']
            },
            popupStyle: {
                blocks: {
                    'Поделитесь с друзьями!': ['yaru', 'twitter', 'vkontakte', 'facebook', 'lj', 'moikrug', 'moimir', 'friendfeed', 'odnoklassniki']
                },
                copyPasteField: true
            }
});
};

jQuery(document).ready(function(){
Social();
});

Анатолий

19 января 2016, 09:36

есть в моем файле http://nanuka.ru/script.js функция social. я туда её прописывал в несколько мест. безрезультатно :(

строчку <script type="text/javascript" src="http://yandex.st/jquery/1.6.2/jquery.min.js" тоже поправил. не помогло :(

Алексей

19 января 2016, 09:36

если вы в москве то 8(985)777-42-49

Анатолий

19 января 2016, 09:36

Всем спасибо! Заработало!

нужно было поставить загрузку jquery.js раньше script.js вызывающию её :)

Ура :)

Особая благодарность

Удалённый пользователь

19 января 2016, 09:36

Еще один валидный вариант:

Алексей

19 января 2016, 09:36

в данном виде это будет в исходном html

во-первых, это просто лишние

во-вторых, пс такие конструкции помимают :)

Удалённый пользователь

19 января 2016, 09:36

Если я все правильно понял

в :

в html коде страницы, там где должна быть кнопка:

скрипт social.js:

function Social() {

new Ya.share({

element: 'ya_share1',

elementStyle: {

'type': 'button',

'quickServices': ['yaru', 'vkontakte', 'facebook', 'twitter', 'odnoklassniki', 'moimir', 'lj', 'friendfeed', 'moikrug']

popupStyle: {

blocks: {

'Поделитесь с друзьями!': ['yaru', 'vkontakte', 'facebook', 'twitter', 'odnoklassniki', 'moimir', 'lj', 'friendfeed', 'moikrug']

copyPasteField: true

}

});

};

jQuery(document).ready(function(){

Social();

});

Все работает.

Как лучше

или

Алексей

19 января 2016, 09:36

как лучше?

тут несколько нюансов,

1. при загрузке jquery со своего домена увеличится время загрузки страницы, т.к. браузер может обращаться к одному домену только в один поток

2 при загрузке из библиотек (яндекса, гугла...) данные ресурсы могут отслеживать информацию о загрузке и использовать её в своих целях

3. можно подгружать просто со своего поддомена, впрочем как и css, img (то что нет необходимости индексировать), но если у вас не сумашедшие по размерам страницы то можно просто со своего домена :)

Удалённый пользователь

19 января 2016, 09:36

Что лучше выбрать

jquery-1.6.2.min.js

или

jquery-1.6.2.js

С Уважением, Алексей

Алексей

19 января 2016, 09:36

min это просто сжатая версия :)

jon4god

19 января 2016, 09:36

Посмотрел http://yandex.st/share/share.js и нашел там два параметра data-vdirection и data-hdirection.

Насколько я понял они отвечают за то в какую сторону открывается окошко поделиться, но при постановке значений up, down,left и right никакой реакции.

Кто знает в чем дело?