Πρόβλημα με twitter button

Από που να ξεκινήσω; Που θα βρω; κ.α. γενικές ερωτήσεις για την δημιουργία μιας ιστοσελίδας.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
sibas
Honorary Member
Δημοσιεύσεις: 1853
Εγγραφή: 21 Φεβ 2003 01:21
Τοποθεσία: Μια εδώ.. Μια εκεί.. Σήμερα είμαι εδώ!!!
Επικοινωνία:

Πρόβλημα με twitter button

Δημοσίευση από sibas » 06 Μάιος 2015 16:05

Τις τελευταίες μέρες μου παρουσιάστηκε ένα πρόβλημα, ξαφνικά δεν εμφανίζεται το twitter button :hammer: :hammer:

έχω ένα div το hide-button και θέλω με το που θα κάνω klik να εμφανίζεται ή να εξαφανίζεται

κώδικας ο παρακάτω

CSS

Κώδικας: Επιλογή όλων

#hide-button{display:none}

HTML

Κώδικας: Επιλογή όλων

<a href="#" id="show-button">show button</a>
<div id="hide-button">
<a class="twitter-share-button"
  href="https&#58;//twitter.com/share"
  data-via="twitterdev">
Tweet
</a>
<script>
window.twttr=&#40;function&#40;d,s,id&#41;&#123;var js,fjs=d.getElementsByTagName&#40;s&#41;&#91;0&#93;,t=window.twttr||&#123;&#125;;if&#40;d.getElementById&#40;id&#41;&#41;return;js=d.createElement&#40;s&#41;;js.id=id;js.src="https&#58;//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore&#40;js,fjs&#41;;t._e=&#91;&#93;;t.ready=function&#40;f&#41;&#123;t._e.push&#40;f&#41;;&#125;;return t;&#125;&#40;document,"script","twitter-wjs"&#41;&#41;;
</script>
</div>

Jquery ready

Κώδικας: Επιλογή όλων

$&#40;'#show-button'&#41;.click&#40;function&#40;&#41;&#123;$&#40;'#hide-button'&#41;.slideToggle&#40;'fast'&#41;;return false&#125;&#41;;
μπορεί κάποιος να μου εξηγήσει γιατί σε firefox, ie10 δεν εμφανίζεται και σε chrome opera εμφανίζεται? :evil:

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Πρόβλημα με twitter button

Δημοσίευση από korgr » 07 Μάιος 2015 11:25

Βρήκα χρόνο να ασχοληθώ και διαπίστωσα πως το πρόβλημα σε κάποιους browsers είναι πως δεν φορτώνουν σωστά τα twitter data στο iframe όταν το container is hidden.
Η λύση που σου παραθέτω είναι dirty αλλά εμένα μου δούλεψε.
Αντί να κρύψω το twitter container, το εξαφανίζω από την σκηνή. Δίνω 1 sec χρονικό περιθώριο να φορτώσει το twitter iframe και μετά αφού το κρύψω το επαναφέρω στη σκηνή.

Επαναλαμβάνω είναι dirty solution αλλά ίσως σου δώσει έναυσμα να το βελτιώσεις :)

Κώδικας: Επιλογή όλων

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<style type="text/css">
#hide-button&#123;position&#58;absolute; top&#58; -9999px&#125;
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<script>
jQuery&#40;function&#40;$&#41;&#123;
	$&#40;'#show-button'&#41;.click&#40;function&#40;&#41;&#123;$&#40;'#hide-button'&#41;.show&#40;&#41;;return false&#125;&#41;;
	setTimeout&#40;function&#40;&#41;&#123;$&#40;'#hide-button'&#41;.hide&#40;&#41;.css&#40;&#123;"position"&#58;"relative", "top"&#58;"0"&#125;&#41;;&#125;,1000&#41;;
&#125;&#41;;
</script>
</head>

<body>
<a href="#" id="show-button">show button</a>
<div id="hide-button">
<a class="twitter-share-button"
  href="https&#58;//twitter.com/share"
  data-via="twitterdev">
Tweet
</a>
<script>
window.twttr=&#40;function&#40;d,s,id&#41;&#123;var js,fjs=d.getElementsByTagName&#40;s&#41;&#91;0&#93;,t=window.twttr||&#123;&#125;;if&#40;d.getElementById&#40;id&#41;&#41;return;js=d.createElement&#40;s&#41;;js.id=id;js.src="https&#58;//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore&#40;js,fjs&#41;;t._e=&#91;&#93;;t.ready=function&#40;f&#41;&#123;t._e.push&#40;f&#41;;&#125;;return t;&#125;&#40;document,"script","twitter-wjs"&#41;&#41;;
</script>
</div>
</body>
</html>


sibas
Honorary Member
Δημοσιεύσεις: 1853
Εγγραφή: 21 Φεβ 2003 01:21
Τοποθεσία: Μια εδώ.. Μια εκεί.. Σήμερα είμαι εδώ!!!
Επικοινωνία:

Πρόβλημα με twitter button

Δημοσίευση από sibas » 09 Μάιος 2015 11:22

korgr ωραίο το delay αλλά κάτι δεν μου πάει καλά, όχι με τον κώδικα σου, απλά ψάχνω να βρώ πιο είναι το conflict!! :hammer:

Απάντηση

Επιστροφή στο “Γενικές ερωτήσεις κατασκευής ιστοσελίδων”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης