2014-12-06 51 views
-2

美好的一天先生。帮我解决这个问题。这个代码只是在我打开页面时自动弹出。我怎样才能将其转换为可点击而不是自动弹出。JavaScript可点击图标代替弹出

<script type="text/javascript" src="//www.klaviyo.com/media/js/public/klaviyo_subscribe.js"> </script> 

    <script type="text/javascript"> 

    KlaviyoSubscribe.attachModalSignUp({ 
     list: 'g9cZtX', 
     delay_seconds: 0.5, 
     content: { 
      clazz: ' klaviyo_modal_g9cZtX', 
      header: "Interested in our Newsletter?", 
      subheader: "Stay in the know with news and promotions.", 
      button: "Subscribe", 
      success: "Thanks! Check your email for a confirmation.", 
      styles: '.klaviyo_modal.klaviyo_modal_g9cZtX { font-family: "Helvetica Neue", Arial}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_header { color:#222;}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_subheader { color:#222;}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button,.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button span { background-color:#07234F; background-image: none; border-radius: 2px;}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button:hover,.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button span:hover { background-color:#2A4D85; background-image: none; }.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_inner,.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_fieldset .klaviyo_field_group input[type=text],.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_fieldset .klaviyo_field_group input[type=email] { border-radius: 2px;}' 
     } 
    }); 

这里是点击图标

<li><a href="#"><i class="icon-envelope icon-2x"></i></a></li> 

帮助我摸不着头脑。 在此先感谢

回答

0

使用点击()这样做或使用。对(“点击”)..这样的改变你的类icon_png代替的icon.png

$(document).ready(function(){ 
    $('.icon_png').on('click',function(){ 
    KlaviyoSubscribe.attachModalSignUp({ 
      list: 'g9cZtX', 
      delay_seconds: 0.5, 
      content: { 
       clazz: ' klaviyo_modal_g9cZtX', 
       header: "Interested in our Newsletter?", 
       subheader: "Stay in the know with news and promotions.", 
       button: "Subscribe", 
       success: "Thanks! Check your email for a confirmation.", 
       styles: '.klaviyo_modal.klaviyo_modal_g9cZtX { font-family: "Helvetica Neue", Arial}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_header { color:#222;}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_subheader { color:#222;}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button,.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button span { background-color:#07234F; background-image: none; border-radius: 2px;}.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button:hover,.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_submit_button span:hover { background-color:#2A4D85; background-image: none; }.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_inner,.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_fieldset .klaviyo_field_group input[type=text],.klaviyo_modal.klaviyo_modal_g9cZtX .klaviyo_fieldset .klaviyo_field_group input[type=email] { border-radius: 2px;}' 
      } 
     }); 
    }); 
    }); 
+0

选择必须是' .icon \\。png' – 2014-12-06 13:05:08

+0

@ Dr.Molle谢谢我更新我的回答 – 2014-12-06 13:07:02

+0

@ Dr.Molle很好的编辑。但我不想让OP不知道点击事件,他怎么能理解这个斜杠..我不希望他以后会变得困惑:) – 2014-12-06 13:31:56