html - Hover Share Button Over Every Image -

-

i using embedded quiz platform, see https://output.jsbin.com/pabopusulo.

i want make every image hover "share button" centered in middle.

facebook share code:

<div class="fb-share-button" data-layout="box_count"></div>

i tried doing using css calling div display:block; did not work. not sure if possible. please keep in mind, new coding.

thanks all.

update: embedded script: 

<script type="text/javascript" src="//cdn.playbuzz.com/widget/feed.js"></script> <div class="pb_feed" data-embed-by="6c7dc1a3-ea2c-490e-8b3f-8526cdf5bcb4" data-game="/drishtib10/what-is-your-personality-type-according-to-your-perception" data-recommend="false" data-game-info="false" data-comments="false" data-shares="false" ></div>

do mean this?

note: can't see result here because of security reason, created bin this.

.wrapper {    position:relative;    display:inline-block;  }    .wrapper:before {    content:"";    position:absolute;    top:0;    left:0;    width:100%;    height:100%;    background:rgba(0,0,0,0.8);    opacity:0;    transition: .3s ease;  }    .fb-share-button.fb_iframe_widget {    position: absolute;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    opacity: 0;    z-index:1;    transition:all .3s ease;  }    .wrapper:hover .fb-share-button.fb_iframe_widget,  .wrapper:hover:before {    opacity:1;  }
<div id="fb-root"></div>  <script>(function(d, s, id) {    var js, fjs = d.getelementsbytagname(s)[0];    if (d.getelementbyid(id)) return;    js = d.createelement(s); js.id = id;    js.src = "//connect.facebook.net/en_us/sdk.js#xfbml=1&version=v2.5&appid=850697865046018";    fjs.parentnode.insertbefore(js, fjs);  }(document, 'script', 'facebook-jssdk'));</script>  <div class="wrapper">    <img src="https://pixabay.com/static/uploads/photo/2016/03/06/16/51/balance-1240737__180.jpg" />    <div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count"></div>  </div>


Comments

Post a Comment

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

-
i have spring project , try make use spring boot , run @ embadded tomcat following : https://spring.io/guides/gs/rest-service/ this application //@configuration //@enableaspectjautoproxy @springbootapplication @componentscan(basepackages = "gux.prome") public class application { public static void main(string[] args) { springapplication.run(application.class, args); } } if use maven command: mvn spring-boot:run , project starts fine, need debug , run main method @ intelij, exception occurs: exception in thread "main" java.lang.illegalargumentexception: cannot instantiate interface org.springframework.context.applicationlistener : org.springframework.boot.logging.classpathloggingapplicationlistener @ org.springframework.boot.springapplication.createspringfactoriesinstances(springapplication.java:414) @ org.springframework.boot.springapplication.getspringfactoriesinstances(springapplication.java:394) @ org.springframework.bo...
Read more

reactjs - React router and this.props.children - how to pass state to this.props.children -

-
i'm using react-router first time , don't know how think in yet. here's how i'm loading components in nested routes. entry point .js reactdom.render( <router history={hashhistory} > <route path="/" component={app}> <route path="models" component={content}> </route> </router>, document.getelementbyid('app') ); app.js render: function() { return ( <div> <header /> {this.props.children} </div> ); } so child of app content component sent in. i'm using flux , app.js has state , listens changes, don't know how pass state down this.props.children. before using react-router app.js defines children explicitly, passing state natural don't see how now. using couple of react helper methods can add state, props , whatever else this.props.children render: function() { var children = react.ch...
Read more

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -

-
i have excel workbook used generate quotations customers. there main page user inputs data, , there buttons generate various pdfs , send them customer. however, 1 user consistently getting error preventing generating , sending pdfs. i beleive "microsoft windows common controls 6.0 (sp6)". it's installed on users' computers. on mine, location "c:\windows\syswow64\mscomctl.ocx" on others "c:\windows\system32\mscomctl.ocx" the user experiencing issues on 32-bit machine, "mscomctl.ocx" file should in system32. have manually put in there, , pointed common controls reference in vba it. issue seems keep reverting looking in syswow64. since folder doesn't exist, can't find it, , can't produce pdfs. i thought perhaps issue user running older version of office (2007) there users on 2013 , 2016. thought perhaps mixture of 64-bit , 32-bit users. user gets sent workbook other users (as quotation process goes further, gets passed ...
Read more