w3学校模态教程不起作用

时间:2016-09-05 18:17:49

标签: html css modal-dialog

嗨我正在关注w3学校关于模态的教程 http://www.w3schools.com/howto/howto_css_modals.asp 但我似乎无法让我开放。我的代码中有什么东西出错或者我错过了什么。

或者你有什么不同的方式建议我这样做吗?

var fs = require('fs');

var colors = {
    "primary-color": "#1d1d1b",
    "secondary-color": "#558ed5",
    "brand-color-a": "#1d446f",
    "brand-color-b": "#9b9b99"
}

function transformJSONtoSCSS(colors) {
  var scssString;
  Object.keys(colors).forEach(function(key) {
    var value = colors[key];
    scssString += "$" + key + ": " + value + ";\n";
  }
  return scssString;
}

gulp.task('color_scss', function() {
  var scssString = transformJSONtoSCSS(colors);
  fs.writeFileSync("/my/dir/path/_colors.scss", scssString); 
});

// Our watch task - notice our deps.
gulp.task('css:watch', ['css', 'color_scss'], function() { gulp.watch("assets/**/*.css", ['css'])});

2 个答案:

答案 0 :(得分:0)

将脚本移动到body标签的底部解决了这个问题

答案 1 :(得分:0)

移动您的脚本<script> var modal = document.getElementById('PopUpLR'); var btn = document.getElementById("myBtn"); var span = document.getElementsByClassName("closeLR")[0]; btn.onclick = function() { modal.style.display = "block"; } span.onclick = function() { modal.style.display = "none"; } window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } </script>

在你的HTML下,按钮知道它发送到什么地方!