2

ポップアップをクリックすると別のページに移動できるようにライトボックスを実装しようとしています..そして、配置の問題などのいくつかの不具合を伴う以下のコードでほぼ達成しました.CSSから調整できますが、 CSS を操作することなく、はるかに優れた代替手段を利用できます。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Magnific Popup</title>

    <link rel="stylesheet" href="css/magnific.css">

    <script src="js/jquery.js"></script>

    <script src="js/magnific.js"></script>


    </head>

    <body>

<script type="text/javascript">

 var data = [{
    userWebsite_href: 'http://www.bradfrostweb.com',

 img_img: 'http://datastore04.rediff.com/h1500-w1500/thumb/69586A645B6D2A2E3131/pvwbsmbfdegzorwo.D.0.Holi-Wallpapers-Images.jpg',

  },

];

$.magnificPopup.open({ 
  key: 'my-popup', 
  items: data,
  type: 'inline',

  inline: {

    markup: '<div class="white-popup"><div class="mfp-close"></div>'+'<a class="mfp-userWebsite">'+'<div class="mfp-img">+</div>'+'</a>'+'</div>'

  },

  gallery: {
    enabled: false
  },
});

</script>

</body>

    </html>
4

0 に答える 0