0

ボタンのクリックでトリガーされる単純な小さなドロップダウンバーを書いています。私はそれをjsfiddleで動作させています: http://jsfiddle.net/sir_charles804/bC4WD/13/ですが、サイトでは実行されません。理由はありますか？サイトにはangularjs jQueryとbootstrapがあるので、そのうちの1つが邪魔になっているかどうかはわかりません。サイトのコードは

HTML

<div id="notificationBar">
    Latest Major News Update
    <button class="pull-right" style="position:relative;" id="hideButton" >notification   </button>
</div>
<button class="pull-right notificationButton" id="showbutton">notification </button>

JS (テスト用に本体で定義済み)

var showNotifications = function () {
    document.getElementById("notificationBar").style.marginTop = "-8px";
};
var hideNotifications = function () {
    document.getElementById("notificationBar").style.marginTop = "-40px";
};

var showButton = document.getElementById('showButton');
var hideButton = document.getElementById('hideButton');

showButton.onclick = showNotifications;
hideButton.onclick = hideNotifications;

CSS (外部シート内)

#notificationBar {
  display: block;
  background-color: #cccccc;
  color:black;
  height: 30px;
  width:100%;
  z-index: 4;
  padding:0px;
  right:0px;
  left:0px;
  margin:0px;
  position:absolute;
  margin-top:-40px;
  -webkit-transition:margin-top .5s ease-in-out;
  -moz-transition:margin-top .5s ease-in-out;
  -o-transition:margin-top .5s ease-in-out;
  transition:margin-top .5s ease-in-out;
  box-shadow:1px 0 3px rgba(0, 0, 0, .75);
}

何か間違っていますか？

編集：

遷移を反映するようにcssを手動で変更すると、それが表示されるため、私の問題はjavascriptで属性にアクセスしているようです。プロパティにアクセス/変更できない原因を知っていstyle.marginTopますか? または、そのプロパティを変更してもマージンが変更されないのはなぜですか?

4

1 に答える 1

0

その機能を入れて修正しましたwindow.onload = function() {};

私の問題は、未定義の「onclick」プロパティを割り当てようとしていたことでした。

于 2013-05-24T16:24:02.217 に答える