javascript - Adjust twitter button without reloading? -
i have random quote generator tweets random quote shown, works except twitter button has reload every time new quote generated , doesn't good. there way change iframe without annoying reload?
link codepen- http://codepen.io/davez01d/pen/gpegpd
html -
<div class="row vert-space-25 vert-bottom-space-25 text-center"><!--twitterbutton--> <div id="twitter-button" class="col-xs-12"> <a class="twitter-share-button" data-size="large">tweet</a> <!--javascript twitter button--> <script>window.twttr=(function(d,s,id){var js,fjs=d.getelementsbytagname(s)[0],t=window.twttr||{};if(d.getelementbyid(id))returnt;js=d.createelement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentnode.insertbefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));</script> </div> </div><!--twitterbutton-->
javascript -
var quotes = [ { text: '"she got big booty call big booty"', author: '2chainz'}, { text: '"success consists of going failure failure without loss of enthusiasm."', author: 'winston churchill'}, { text: '"if you\'re going through hell, keep going."', author: 'winston churchill'}, { text: '"success not final, failure not fatal: courage continue counts."', author: 'winston churchill'}, { text: '"nearly men can stand adversity, if want test man\'s character, give him power."', author: 'abraham lincoln'}, { text: '"whatever are, one."', author: 'abraham lincoln'}, { text: '"i walk slowly, never walk backward."', author: 'abraham lincoln'}, ]; $("#newquote").click(function() { var randomnum = math.floor(math.random() * quotes.length); //get random number between 0 , quotes.length $("#quote").html(quotes[randomnum].text); //insert random quote html $("#author").html(" -" + quotes[randomnum].author); //insert author html createbutton(); //creates new twitter button, when shared have displayed quote , author }); var createbutton = function () { $('iframe.twitter-share-button,a.twitter-share-button').remove(); //removes iframe generated twitter widgets js var twtr = '<a class="twitter-share-button"></a>'; $('#twitter-button').append(twtr); //creates new twitter button $('.twitter-share-button').attr('href', 'https://twitter.com/share') .attr('data-text', $('#quote').html()+$('#author').html()).attr('data-size', 'large'); //sets attributes on new twitter button when shared displays quote , author twttr.widgets.load(); //reloads js twitter button };
nope. security reasons, javascript on page has no access iframes on page reside on other domains. if control both host page , page in iframe, can use postmessage pass messages between them.
however, need use twitter iframe button? there other ways share twitter javascript. 1 simple way compose share url: https://twitter.com/share?text=xxx&url=yyy
where xxx
tweet text , yyy
url have text link to. sure url-encode both xxx , yyy.
so can use own button or link, , accomplish same thing.
Comments
Post a Comment