Internet Explorer 7弹出窗口模式不开放

我试了2天，但我不知道如何解决这个问题。Internet Explorer 7弹出窗口模式不开放

在Firefox和铬的工作正常。加上最新的IE浏览器也可以，但IE7和IE8弹出窗口不打开。

http://webteezy.com/demos/prototype.html#

我想要做什么。当点击baloon时弹出窗口会打开，其中有少量数据。但是当在该弹出窗口中点击MetaData时，应该打开另一个弹出窗口模式。它在其他浏览器中工作正常，IE7和IE8除外。

怎么办？

= - == - == - =

例如

在模态

元数据按钮表示当气囊被按压

<p><a href=# class="butt CB00071">Data</a><a href="#CB00071" class="butt hover CB00071">MetaData</a></p>

脚本低于

$('body').on('click','.CB00071',function(e){ 
    $('#CB00071').css({'display':'inline-block', 
     '*display': 'inline', 
     'zoom': '1'}); 
});

和最后按下按钮时模式显示。以下是Modal。

<div id="CB00071" class="overlay light" style="display: none"> 
    <a class="cancel" href="#"></a> 
    <div class="popup"> 
     <h2>KINGDOM OF SAUDI ARABIA</h2> 
     <h3>GENERAL COMMISSION FOR SURVEY, GEODESY & LAND SURVEY</h3> 
     <div class="content"> 

      <div class="col-1-1"> 
       <div class="col-1-2"><p class="info">Site Name <span>CB0007</span></p></div> 
       <div class="col-1-4"><p class="info">Station Number <span>CB00071</span></p></div> 
       <div class="col-1-4"><p class="info">Site Type <span>Ex-Center</span></p></div> 
      </div> 
      <div class="col-1-2"><p class="info">Province <span>Mekkah</span></p></div> 
      <div class="col-1-2"><p class="info">Town/Location Name <span>CB0010</span></p></div> 
      <div class="col-1-1"> 
       <div class="col-1-4"><p class="info">Latitude <span>N21°37'02.54104"</span></p></div> 
       <div class="col-1-4"><p class="info">Longitude <span>E40°08'48.54207"</span></p></div> 
       <div class="col-1-4"><p class="info">Height <span>614.224m</span></p></div> 
       <div class="col-1-4"><p class="info">Absolute Gravity<span>978540849.6(µGal)</span></p></div> 
      </div> 
      <p><a href="logsheets/obs_card_cb071.pdf" class="butt hover">Download Details Log Sheet</a></p> 
     </div> 
    </div> 
</div>

但不知何故，它不工作在IE7/8？

来源

2015-07-11 Sizzling Code

您项目中使用的外部库，它们是否支持IE7 IE8？许多功能在IE7/8上不起作用。 –

@Mike 一切工作正常。其弹出窗口模式不开放，这是不相关的图书馆，我想.. –

您正在尝试使用CSS3伪选择器，在弹出层:target

你的CSS：

.overlay:target { 
    visibility: visible; 
    opacity: 1; 
}

这是（基本上）它是如何工作：

您覆盖divs每个都有一个id属性，例如<div id="CB00070" class="overlay light">...</div>
当点击一个带有引用该id的href的链接（<a href="#CB00070">...</a>）时，该div成为的点击目标。
目标div将继承已为其指定的:target造型，在这种情况下visibility:visible; opacity:1;

不幸的是IE浏览器的版本小于9不以这种方式为:target选择在介绍行为CSS的更高版本（http://caniuse.com/#feat=css-sel3）

如果您确实需要支持较旧的IE版本，您可以尝试透过添加一个类来揭示相关的<div>，该类将揭示它并将类移除到h再次IDE中，像：

$('body').on('click','.CB00070',function(e){ 
    // reference our target div 
    var targetDiv=$('#CB00070'); 
    // add a class so that it can be styled using css which older browsers will recognise 
    targetDiv.addClass('target'); 
    // make sure there is only ever one active target 
    targetDiv.siblings('.target').removeClass('target'); 
    // add in the behaviour that was working previously 
    // (though these styles could be put into the stylesheet) 
    targetDiv.css({'display':'inline-block', 
     '*display': 'inline', 
     'zoom': '1'}); 
});

，您还需要去掉上课的时候取消链接被点击

$('body').on('click','.cancel', function(e){ 
    $('div.target').removeClass('target'); 
})

然后，你将需要引用在你的CSS目标类，使用.target而不是:target

你也可能想看看不必列出每个这些元数据链接的一些方法：

$('body').on('click','a[href ^= "#CB"]',function(e){ 
// this should catch all of your meta data links 
// you will need to find the target div using the href 
// attribute of the link that has just been clicked 
})

来源

2015-07-11 09:14:24 kevmc

添加类到div如何？不知道如何：目标在这里工作.. –

Internet Explorer 7弹出窗口模式不开放

回答

相关问题