0

私はこのJavascript関数を呼び出しています：

var facing = "First";

function switchit(list){
      if (list != facing){
          document.getElementById(facing).style.display="none";
  };
 var listElementStyle=document.getElementById(list).style;
      if (listElementStyle.display=="none"){
          listElementStyle.display="block";
  } else {
          listElementStyle.display="none";
  }
 facing = list;
 }
</script>

ネストされたdiv内にあるため、ハイパーリンクをクリックすると、次のスニペットのように1つの要素が表示され、もう1つの要素が非表示になります。

    <div id="bio">



            <!--Ty Expansion -->
            <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="bioEmphasis">What</span> O.L.L.I.E. Lifestyle represents is very personal to me. It has been an aspiration of mine to dedicate myself to the betterment and empowerment of our youth.  <a href="javascript:switchit('First')">Click to read more..</a><br />
         <div id="First" style="display: none;">   

            </p>

           <hr/><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="bioEmphasis">Apart</span> of a society where the vast majority of youth are growing up in single parent homes (many in low income neighborhoods). I have witnessed first hand how heavily influenced the youth are by television, music and movies. More Educators, Athletes and Professionals are needed to lend encouragement and guidance on becoming productive members to our environment instead of adapting to a fatal cliché of being a product of their environment.</p>
    </div>

    <p>
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="bioEmphasis">Life is</span> a crazy game!! The trick is to learn how to play! Growing up in New Jersey, the second youngest out of eight, I was fortunate enough to see how the game is NOT supposed to be played.  I watched my brothers and sister go through dealing with the law, drugs, and a “content” way of life. This was the beginning of me really wanting to live my life in excellence.  <a href="javascript:switchit('Second')">Click to read more..</a><br />
         <div id="Second" style="display: none;">   


         </p>
         <hr/><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="bioEmphasis">All through</span> middle and high school, I was an honor student. Unfortunately, I always was attracted to the “under life”. It seemed like the more popular, in crowd thing to do. I felt like this because of some of my earlier struggles. Having a distinct name and a handicapped brother would fuel my want to be a part of the normal crowd. I can fondly remember being constantly made fun of for being different. Little did I know, what I was doing all along was the right thing and would pay off.</p>
    <hr />

    </div>
</div>

関数は、より大きなdivコンテナ内で一度に1つのdiv要素を展開するために完全に機能します。問題は、ハイパーリンクをクリックしていずれかの要素を展開すると...大きなdivコンテナ（赤いグラデーションの四角）がすべてを背景（灰色の四角）を超えて押し、ページ全体の外観を台無しにすることです。 （これは数レベル上です）、背景を含むのは固定幅です（パーセンテージ幅は機能しないため）。ユーザーがハイパーリンクをクリックした結果、背景を動的に拡張する必要がある正確な2つの幅はわかっていますが、前述のJavascript関数内からこれを行う方法がわかりません。誰かが私のために何かアイデアや助けを持っていますか？サイズを変更する必要があるdivは、使用している関数呼び出しの3レベル外であるため、非常に混乱します。

div＃topwrapper-> div＃greySquareH-> div＃LeftSide-> div＃bioWrapper-> div＃bio

その結果、div＃Firstまたはdiv＃Secondのいずれかがdiv＃bio内で生成されます。div＃greySquareHheightプロパティのサイズを変更する必要があります。事前に助けてくれてありがとう！

4

1 に答える 1

0

私があなたの質問に正確に従うかどうかはわかりません-あなたは読みにくい多くの詳細を入れており、あなたの要点を隠しているようです。

div＃greySquareHの高さを動的に変更する方法を尋ねているだけだと思います

その場合、あなたが欲しいのは

document.getElementById("greySquareH").style.height="40px";

もちろん、「40px」は任意の高さに置き換えます

それ以上の情報をお探しの場合は、他に何を求めているのかを説明する簡単なコメントを残してください。

更新： HTMLページ全体に1つしかないdocumentため、そのコード行を任意の関数に入れることができ、同じことを実行します。

すでに作成したswitchit関数は、アタッチしたDIVでのみ機能するように制限されていません。

行の直前にある既存の関数にドロップするだけfacing = list;です。

于 2011-02-04T01:31:30.900 に答える