4

I've got a page which uses both the unofficial github buttons, and code which I highlight using this syntax highlighter.

The problem is, the two github buttons are iframes which both make requests to api.github.com, and it can sometimes take a while for them to load.

While the buttons are loading (and chrome says "waiting for api.github.com"), the syntax highlighter's javascript can't execute. It doesn't execute until the iframes are fully loaded, which sometimes can take quite a while.

I'd much prefer to have no github buttons and have my code highlighted faster than have the github buttons load first. How can I achieve this?

I've tried loading the buttons asynchronously with javascript, but they don't load properly because the javascript in the iframes doesn't execute for some reason.

Here's how I load up the SyntaxHighlighter (in the <head>)

<script type="text/javascript" src="js/shCore.min.js"></script>
<script type="text/javascript" src="js/brushes.min.js"></script>
<script type="text/javascript">
SyntaxHighlighter.defaults['gutter'] = false;
SyntaxHighlighter.defaults['toolbar'] = false;
SyntaxHighlighter.all();
</script>

And the iframe HTML looks like this:

<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=watch&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=fork&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>

How can I stop the buttons from blocking my JS?

4

3 回答 3

0

您是否尝试过使用 jquery deferred。您可以在http://www.erichynds.com/jquery/using-deferreds-in-jquery/找到一个示例

于 2012-06-15T08:20:53.477 回答
0

您可以在使用 javascript 加载文档后分配 iframe src。这样，您的页面将仅加载查找，然后这些可能会花费他们想要的所有时间。

一些喜欢：

<script>
function showbuttons()
{
  var path1 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=watch&amp;count=true&amp;size=large";
  var path2 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=fork&amp;count=true&amp;size=large";
  document.getElementById('frame1').src = path1;
    document.getElementById('frame2').src = path2;
}
</script>

html:

<body onload="showbuttons()">
<iframe id="frame1" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
<iframe id="frame2" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
于 2012-06-15T08:53:31.720 回答
0

要阻止 iframe 出现在其他人的网站上，您可以使用此脚本

if(document.querySelector('html').ownerDocument.location.ancestorOrigins[0]==undefined==false){
    document.querySelector('html').innerHTML='hello plagiat web.....visit official web... visit here : '+document.querySelector('html').ownerDocument.URL;}
于 2020-06-26T16:37:52.487 回答