जावास्क्रिप्ट या HTML / CSS चल div मुद्दा, अन्य मुद्दा हो सकता है

वोट
0

* मैं सवाल पूछ रखने के लिए नफरत है, लेकिन हालांकि मैं कई वर्गों के लिए चले गए हैं मैं जावास्क्रिप्ट में सिर्फ भयानक रहा हूँ। मैं दो divs मैं केवल जब दर्शक ऐसा करने के लिए एक बटन क्लिक करता है दिखाना चाहते हैं के साथ एक वेबपृष्ठ है। div के अंदर बंद करें बटन है। मैं अन्य लाइटबॉक्स सामान करने के लिए स्विच करने के लिए या पूरी तरह से फिर से इसे बदल चाहते हैं न। मैंने शुरू किया है एक निश्चित तरीके से फिर किसी कृपया किसी अन्य विधि के लिए जावास्क्रिप्ट बदलें ताकि वे एक दूसरे को ओवरलैप नहीं होता था।

इस कोडन है: *

सबसे पहले DIV + बटन

<div id=nodate style=display:none><span class=A> <input type=image src=http://www.weebly.com/uploads/1/6/7/6/16768236/custom_themes/307429121386408805/files/close-icon.png?1384992227202 width=42 onclick=collapse.call(this); /></span><b>There are no reservations listed under the date you selected. </b>Please select another date or ask for assistance.
<br>
<br>
<image style=border:2px solid #000 src=http://www.weebly.com/uploads/1/6/7/6/16768236/custom_themes/307429121386408805/files/shutterstock_9121894.jpg?1385086331177 width=200 />
</div>
<input type=submit style=background-color: #E0E0E0; padding: 4px; border: solid 2px #000; cursor:pointer; margin: 2px; border-radius: 10px; value=Friday November 22nd, 2013 onclick=toggle.call(this);></input>

दूसरा DIV + बटन (और अधिक शामिल हैं)

<br>
<br>
<div id=nodate2 style=display:none><span class=A> <input type=image src=http://www.weebly.com/uploads/1/6/7/6/16768236/custom_themes/307429121386408805/files/close-icon.png?1384992227202 width=42 onclick=collapse.call(this); /></span><h2>Cool! We’ve got reservations for the date you selected. </h2>

<u>Your name must use a proper format or you will receive a notice that your reservation could not be found.</u>

<ul>
    <li>&bull; Both First &amp; Last</li>
    <li>&bull; First &amp; Last name must have first letter capitalized</li>
    <li>&bull; Single space between first &amp; last name</li>
</ul>Ex: Austin Block
<br><br>
<left>
<b>Input Your Name</b><br>
<form name=login style=margin: 0px>
<INPUT TYPE=text NAME=pass size=17 onKeyDown=if(event.keyCode==13) event.keyCode=9; style=width: 152px; margin: 5px;><br>
<input type=button value=Click to Continue style=width : 150px; margin: 3px onClick=TheLogin(this.form)>
</form><font color=red>(You MUST use the button. Return key will NOT work.)</font>
</center>
<br>
<br>
<image style=border:2px solid #000 src=http://www.weebly.com/uploads/1/6/7/6/16768236/custom_themes/307429121386408805/files/reservations2.jpg?1385069953644 width=200 />
</div>

<input type=submit style=background-color: #E0E0E0; padding: 4px; border: solid 2px #000; cursor:pointer; margin: 2px;  border-radius: 10px; value=Saturday November 23rd, 2013 onclick=toggle.call(this);></input>

JAVASCRIPT

<script>
var toggle = function () {
var mydiv =this.previousElementSibling;
mydiv.style.display = (mydiv.style.display || 'block') === block ? 'none' :'block'
}
var collapse = function(){
this.parentElement.parentElement.style.display = 'none';
}
</script>

मैं सीएसएस शामिल नहीं किया। क्या जरूरत है विशिष्ट तत्वों के लिए जावास्क्रिप्ट आवंटित करने के लिए नहीं क्या यह अब है। मैं भी पूरी तरह से समझ न कैसे अपने वर्तमान काम कर रहा है, लेकिन जिस तरह से मैं समझता हूँ कि इसकी सिर्फ तत्व प्रभावित कर रहा है / खुला बटन से पहले div। कारण मैं इसे ठीक करने की जरूरत है क्योंकि यह जहां तालिका समाप्त होता है करने के लिए ले जाता है जब मैं एक तालिका में रख div (माना जाता निरपेक्ष तैनात होना) है। मैं जानता हूँ कि क्यों न, शायद वहाँ कुछ और इसका कारण है, लेकिन किसी भी मदद की बहुत सराहना की है।

22/11/2013 को 22:44
उपयोगकर्ता
अन्य भाषाओं में...                            


1 जवाब

वोट
0

इसे इस्तेमाल करे :

<script>
        var activeDiv ="";
        var toggle = function () {
            var mydiv = this.previousElementSibling;
            mydiv.style.display = (mydiv.style.display || 'block') === "block" ? 'none' : 'block'
            if( (activeDiv != mydiv.id)&& (activeDiv!=""))
                collapse(activeDiv);
            activeDiv = mydiv.id;
        }
        var collapse = function (id) {
            var activeDiv = document.getElementById(id);
            activeDiv.style.display = 'none';
        }
</script>
22/11/2013 को 23:10
का स्रोत उपयोगकर्ता

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more