Social media share knoppen met javascript koppelen

[Sp0cK_]

Hallo,

Het betreft de share icoontjes op de homepage van chinasurfreport.com
Als je hovert dan komen de social links tevoorschijn. Ik krijg het niet voor mekaar om het javascript ermee te koppelen, zodat als je erop klikt dan zo'n share venstertje tevoorschijn komt.
In de rechterzijbalk werkt hij prima zoals je kan zien.
De reden is omdat ik de standaard div heb aangepast omdat ik 'm anders wil stylen. Dus standaard is de div class bshare-custom en heb die bshare-cn genoemd en eigen style eraan gegeven.
Al is het mogelijk dat ik bshare-custom op 2 manieren kan stylen dan is het probleem opgelost...
Ideeen?

Ik heb in het javascript ook geprobeerd alles aan te passen van .bshare-custom naar .bshare-cn

Thanks!

code:

<div class="bshare-cn">
    <div class="bsPromo bsPromo2"></div>
    <a title="&#20998;&#20139;&#21040;&#24494;&#20449;" class="bshare-weixin" href="javascript:void(0);"></a>
    <a title="&#20998;&#20139;&#21040;&#26032;&#28010;&#24494;&#21338;" class="bshare-sinaminiblog" href="javascript:void(0);"></a>
    <a title="&#20998;&#20139;&#21040;QQ&#31354;&#38388;" class="bshare-qzone"></a>
    <a title="&#26356;&#22810;&#24179;&#21488;" class="bshare-more bshare-more-icon more-style-addthis"></a>
    <span class="BSHARE_COUNT bshare-share-count" style="float: none; left: 36px; color: rgb(255, 255, 255);">87</span>
</div>

<div class="bshare-custom">
    <a title="Share on Facebook" class="bshare-facebook">Facebook</a>
    <a title="Share on Twitter" class="bshare-twitter">Twitter</a>
    <a title="Share on Weibo" class="bshare-sinaminiblog">Weibo</a>
    <a title="Share on QQ" class="bshare-qzone">QQ</a>
    <a title="Share on WeChat" class="bshare-weixin">WeiXin</a>
    <a title="More Social Media Platforms" class="bshare-more bshare-more-icon more-style-addthis">+</a>
    <span class="BSHARE_COUNT bshare-share-count" style="float: none; left: 36px; color: rgb(255, 255, 255);">87</span>
</div>

JavaScripts:
chinasurfreport.com/javascripts/buttonLite.js
chinasurfreport.com/javascripts/bshareC0.js

[ Voor 51% gewijzigd door Sp0cK_ op 21-01-2015 15:34 ]

[NMe]

Kom eerst eens met wat relevante code en/of een uitgeklede testcase. De site die je linkte is retetraag (ik had na een minuut nog steeds een wit scherm) en sowieso stellen we de verkapte spam van linken naar live sites niet op prijs.

[Sp0cK_]

Aangepast

NMe schreef op woensdag 21 januari 2015 @ 15:31:
Kom eerst eens met wat relevante code en/of een uitgeklede testcase. De site die je linkte is retetraag (ik had na een minuut nog steeds een wit scherm) en sowieso stellen we de verkapte spam van linken naar live sites niet op prijs.

[NMe]

Waarom heb je überhaupt javascript nodig? Als ik je goed begrijpt wil je on hover wat knopjes tonen. Dat is toch gewoon een kwestie van display: none op de container die al die knopjes bevat en display: block op dezelfde container :hover? En als je het niet wil bij hover maar bij een klik dan doe je hetzelfde met een class die je "active" noemt ofzo in plaats van :hover en dan is het enige stukje javascript dat je nodig hebt iets om die active class te togglen.

[ Voor 32% gewijzigd door NMe op 21-01-2015 15:53 ]

[Sp0cK_]

code:

.bshare-custom:nth-child(1) {

Heeft het opgelost Hiermee kan je meerdere stylen aan dezelfde div geven. Precies wat ik nodig had

[Cor453]

Dat is in ieder geval duidelijk ja . Wat was nou precies je probleem en hoe heb je het opgelost? Misschien heeft iemand dan nog wat aan dit topic!

[Sp0cK_]

Cor453 schreef op woensdag 21 januari 2015 @ 16:14:
Dat is in ieder geval duidelijk ja . Wat was nou precies je probleem en hoe heb je het opgelost? Misschien heeft iemand dan nog wat aan dit topic!

met :nth-child(1), (2), (3) etc kan je dezelfde div class oproepen maar verschillend stylen. Heel tof!

[dev10]

Toch kun je beter voor deze verschillende knopjes een aparte class aanmaken, in plaats van met nth-child te gaan werken. Want wat gebeurt er als je er voor kiest om de volgorde te veranderen? En nee, het antwoord is niet: 'dan pas ik de CSS ook aan', want dat gaat geheid een keer vergeten worden.

[Sp0cK_]

dev10 schreef op woensdag 21 januari 2015 @ 16:27:
Toch kun je beter voor deze verschillende knopjes een aparte class aanmaken, in plaats van met nth-child te gaan werken. Want wat gebeurt er als je er voor kiest om de volgorde te veranderen? En nee, het antwoord is niet: 'dan pas ik de CSS ook aan', want dat gaat geheid een keer vergeten worden.

Klopt! Class heb ik veranderd, maar probleem was dat het javascript niet werkte met een andere class. De class moet .bshare-custom heten anders werkt het hele share gebeuren niet. Zelfs in javascript alles aangepast, zonder resultaat.

[dev10]

Hint: je kunt meerdere classes op een element zetten.