2017-11-03 25 views
0

ご覧ください。this link:あらかじめ選択したタブと選択したタブに異なる背景色を与えるにはどうすればいいですか?

4つのタブがあります。私は2つの質問があります:

質問1:上記のリンクをエクスプローラで表示すると、選択したタブ(CSSフォーカス経由)に黒い背景が表示されます。しかし、上記のリンクをエッジで見ると、これはうまくいかないようです。私は何を変更する必要がありますか?

質問2:最初に(エクスプローラを使用して)あらかじめ選択したタブ(最初のタブ)はこの黒い背景を表示しません。この黒い背景は、タブの1つをクリックした後にのみ表示されますが、ページをリロードした後は表示されません。あらかじめ選択したタブを変更するために必要な変更は、ページのリロード直後に既に黒い背景を表示していますか?

は、任意の提案を楽しみにしてい

<style> 
#tab1, #tab2, #tab3, #tab4 { 
    float: left; 
    padding: 5px 10px 5px 10px; 
    background: #B00098; 
    color: #FFFFFF; 
    margin: 0px 5px 0px 5px; 
} 

#tab1:hover, #tab2:hover, #tab3:hover, #tab4:hover { 
    background: #E800C9; 
} 

#tab1:focus, #tab2:focus, #tab3:focus, #tab4:focus { 
    background: #333333; 
} 

#tab1Content, #tab2Content, #tab3Content, #tab4Content { 
    width: 100%; 
    height: 500px; 
    padding: 20px; 
    border: 1px solid #B00098; 
} 

#tab1Content { 
display: block; 
} 

#tab2Content, #tab3Content, #tab4Content { 
display: none; 
} 

#tab2Content, #tab3Content, #tab4Content { 
display: none; 
} 

.tops { 
    vertical-align: top; 
} 

.text { 
    text-align: justify; 
    padding-right: 10px; 
    width: 80% 
} 


img { 
    padding-right: 5px; 
    margin-top: -20px; 
} 


</style> 



<script> 
function selectTab(tabIndex) { 
    //Hide All Tabs 
    document.getElementById('tab1Content').style.display="none"; 
    document.getElementById('tab2Content').style.display="none"; 
    document.getElementById('tab3Content').style.display="none"; 
    document.getElementById('tab4Content').style.display="none"; 

    //Show the Selected Tab 
    document.getElementById('tab' + tabIndex + 'Content').style.display="block"; 
} 

</script> 





<div id="tab1" onClick="JavaScript:selectTab(1);">Boek 1</div> 
<div id="tab2" onClick="JavaScript:selectTab(2);">Boek 2</div> 
<div id="tab3" onClick="JavaScript:selectTab(3);">Boek 3</div> 
<div id="tab4" onClick="JavaScript:selectTab(4);">Boek 4</div> 

<br/> 

<div id="tab1Content"> 
<table><tr><td class="text"> 
<b>Identiteit – Paul Verhaeghe</b><br> 
Maatschappelijke veranderingen hebben gezorgd voor een veranderd ik-gevoel. Paul Verhaeghe onderzoekt de effecten van dertig jaar neoliberalisme, vrijemarktwerking, privatisering en de relatie tussen de maakbare samenleving en onze identiteit. Wie wij zijn wordt zoals altijd bepaald door de context waarin wij leven. Die context bepaalt op dit moment: Wie geen succes heeft zal ziek zijn.<br><br> 

De dwang tot succes en geluk blijkt een keerzijde te hebben: het leidt tot verlies aan zelfbesef, tot desoriëntatie en vertwijfeling. De mens is eenzamer dan ooit. De liefde is moeilijk te bereiken en betekenisvol leven is diepgaand problematisch geworden. Vanuit zijn klinische ervaring als psychotherapeut laat Verhaeghe zien hoezeer de veranderde maatschappij doorwerkt in de hedendaagse individuele psychische problemen. Mensen komen met andere psychische klachten bij de psychiater dan voorheen.<br><br> 

<b>Over de auteur</b><br> 
Paul Verhaeghe (geb. 5 november 1955) is van opleiding klinisch psycholoog, van vorming psychoanalyticus. Zijn eerste doctoraat (1985) handelde over hysterie, zijn tweede (1992) over psychodiagnostiek. Hij werkt als gewoon hoogleraar aan de universiteit van Gent. Sedert 2000 gaat zijn belangstelling vooral naar de invloed van maatschappelijke veranderingen op psychologische en psychiatrische moeilijkheden. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_1.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 

<div id="tab2Content"> 
<table><tr><td class="text"> 
<b>Get your guts, je instinct als kompas – Hilde Bolt</b><br> 
Iemand met Guts is een persoon met lef, met ballen. Maar heeft lef te maken met de darmen ('gut' = 'darm'), met onze buik? Een heleboel. Ons buikgebied bevat veel meer wijsheid dan we denken. Guts heeft een dubbele betekenis: de signalen uit het buikgebied zijn het instrument, het kompas van waaruit je kunt leven. En Guts is de kracht die je nodig hebt om hiernaar te handelen. Het leven kan mooi, maar ook vol risico's en soms wreed zijn. We kunnen niet altijd kiezen wat onze weg kruist. Toch is het vaak mogelijk om lichter, speelser, creatiever en eenvoudiger met het leven om te gaan.<br><br> 

Get your Guts is een wake-up call, een herinnering aan je eigen oorsprong. De wijsheid van je lichaam, je buikgebied geeft je de mogelijkheid om oeroude instinctieve en verborgen kennis weer tot leven te brengen. Get your Guts is een boek voor mensen die zelf guts willen ontwikkelen, maar ook een boek dat iedere therapeut, coach of hulpverlener gelezen moet hebben. 
<br><br> 
<b>Over de auteur</b><br> 
Hilde Bolt werkt als zelfstandig gevestigd coach, counselor, trainer en psychotherapeut. Ze heeft zich bijgeschoold in oosterse en westerse vormen van lichaamsgericht werken. Tijdens de trainingen creëert ze een veilige, creativiteit bevorderende sfeer waarin veel ‘op maat’ geëxperimenteerd kan worden zodat een ieder op een eigen manier het optimale rendement uit de training kan halen. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_2.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 

<div id="tab3Content"> 
<table><tr><td class="text"> 
<b>Zin kun je maken - Ilse Vooren en Merlijn Koch</b><br> 
Vanaf nu is zingeving begrijpelijk en hanteerbaar. Zin kun je maken benadert zingeving als een vermogen, waarbinnen vaardigheden en competenties te ontwikkelen zijn. We hebben meer ruimte dan ooit om stil te staan bij de betekenis van onszelf en ons bestaan. Zingeving speelt in onze diepste lagen en vragen en werkt door in het alledaagse leven. Wanneer en hoe ervaar je zin? Dit boek maakt helder hoe zingevingsprocessen werken en wat de functie van zingeving is.<br><br> 
Zingeving hanteerbaar maken is belangrijk om richting te geven aan leven en werk. Voor coaches, leidinggevenden en andere professionals is praktische kennis van zingeving tegenwoordig essentieel. Het gesprek kunnen voeren op het niveau van betekenis is onderdeel van het nieuwe organiseren, leidinggeven en de zelfsturing van professionals. 
Dit boek geeft concrete handvatten om processen van zingeving te begeleiden, individueel en in organisaties. Je ontdekt hoe je kunt bijdragen aan ervaringen van zin in alle verschijningsvormen, zoals motivatie, betrokkenheid, voldoening, (eigen)waarde en betekenis.<br><br> 
<b>Over de auteurs</b><br> 
Ilse Vooren en Merlijn Koch zijn beiden humanisticus. Ilse is oprichter van Food for Flow en gespecialiseerd in zingeving, energie en performance. Merlijn is coach en trainer bij de landelijke coachorganisatie Resilians, met expertise in het vergroten van vitaliteit en veerkracht. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_3.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 


<div id="tab4Content"> 
<table><tr><td class="text"> 
<b>Mentaliserend Coachen – Peter Bleumer en René Meijer</b><br> 
Mentaliseren is het vermogen tot zelfreflectie en inleving, beide noodzakelijk om goed te functioneren op het werk en privé. Sommige mensen kunnen niet goed mentaliseren, en veel mensen die dit vermogen wel hebben, verliezen het als ze stress ervaren of emotioneel zijn.<br><br> 

Voor effectieve coaching en training is zelfreflectie van de deelnemers essentieel. Wat nu te doen als juist in dat gebrek aan mentaliserend vermogen het probleem schuilt? Dit praktische boek laat zien hoe mensen kunnen leren beter te mentaliseren. Het bevat concrete handvatten voor coaches, trainers en leidinggevenden voor het bevorderen hiervan. 
<br><br> 
<b>Over de auteurs</b><br> 
Ilse Vooren en Merlijn Koch zijn beiden humanisticus. Ilse is oprichter van Food for Flow en gespecialiseerd in zingeving, energie en performance. Merlijn is coach en trainer bij de landelijke coachorganisatie Resilians, met expertise in het vergroten van vitaliteit en veerkracht. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_4.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 

下記関連のコードを見つけてください! 敬具、ピョートルLinski

答えて

0

:focusセレクタがクリックされる項目を必要と使用して、最初の2番目の質問に答えるために、あなたはそれがフォーカスされるように設定することができたときにJavaScriptを使用して、ウィンドウのロード:

window.onload = function() { 
    document.getElementById("tab1").focus(); 
}; 

あなたがしようとしているように、両方のブラウザが背景色を#333に変更していないため、エッジ/エクスプローラの問題に関しては、再作成できません。

両方を解決するには、CSSとJSで:focusの代わりにクラスを使用することをお勧めします。

CSS:

#tab1.selected, #tab2.selected, #tab3.selected, #tab4.selected { 
    background: #333333; 
} 

JS:

document.getElementById('tab1').className = ""; 
document.getElementById('tab2').className = ""; 
document.getElementById('tab3').className = ""; 
document.getElementById('tab4').className = ""; 

document.getElementById('tab' + tabIndex).className = "selected" 

HTML:mtr.webに

<div class="selected" id="tab1" onClick="JavaScript:selectTab(1);">Boek 1</div> 
<div id="tab2" onClick="JavaScript:selectTab(2);">Boek 2</div> 
<div id="tab3" onClick="JavaScript:selectTab(3);">Boek 3</div> 
<div id="tab4" onClick="JavaScript:selectTab(4);">Boek 4</div> 
0

おかげで、私は解決するために管理しました この問題。 私は自分の提案をコードに統合しました。 その結果はthis link ...

で確認できます。

<style> 
#tab1, #tab2, #tab3, #tab4 { 
    float: left; 
    padding: 5px 10px 5px 10px; 
    background: #B00098; 
    color: #FFFFFF; 
    margin: 0px 5px 0px 5px; 
} 

#tab1:hover, #tab2:hover, #tab3:hover, #tab4:hover { 
    background: #E800C9; 
} 

#tab1.selected, #tab2.selected, #tab3.selected, #tab4.selected { 
    background: #333333; 
} 

#tab1Content, #tab2Content, #tab3Content, #tab4Content { 
    width: 100%; 
    height: 500px; 
    padding: 20px; 
    border: 1px solid #B00098; 
} 

#tab1Content { 
display: block; 
} 

#tab2Content, #tab3Content, #tab4Content { 
display: none; 
} 

#tab2Content, #tab3Content, #tab4Content { 
display: none; 
} 

.tops { 
    vertical-align: top; 
} 

.text { 
    text-align: justify; 
    padding-right: 10px; 
    width: 80% 
} 

img { 
    padding-right: 5px; 
    margin-top: -20px; 
} 
</style> 

<script> 
function selectTab(tabIndex) { 
document.getElementById('tab1').className = ""; 
document.getElementById('tab2').className = ""; 
document.getElementById('tab3').className = ""; 
document.getElementById('tab4').className = ""; 
document.getElementById('tab' + tabIndex).className = "selected" 

//Hide All Tabs 
document.getElementById('tab1Content').style.display="none"; 
document.getElementById('tab2Content').style.display="none"; 
document.getElementById('tab3Content').style.display="none"; 
document.getElementById('tab4Content').style.display="none"; 
//Show the Selected Tab 
document.getElementById('tab' + tabIndex + 'Content').style.display="block"; 
} 
</script> 

<div class="selected" id="tab1" onClick="JavaScript:selectTab(1);">Boek 1</div> 
<div id="tab2" onClick="JavaScript:selectTab(2);">Boek 2</div> 
<div id="tab3" onClick="JavaScript:selectTab(3);">Boek 3</div> 
<div id="tab4" onClick="JavaScript:selectTab(4);">Boek 4</div> 
<br/> 

<div id="tab1Content"> 
<table><tr><td class="text"> 
<b>Identiteit – Paul Verhaeghe</b><br> 
Maatschappelijke veranderingen hebben gezorgd voor een veranderd ik-gevoel. Paul Verhaeghe onderzoekt de effecten van dertig jaar neoliberalisme, vrijemarktwerking, privatisering en de relatie tussen de maakbare samenleving en onze identiteit. Wie wij zijn wordt zoals altijd bepaald door de context waarin wij leven. Die context bepaalt op dit moment: Wie geen succes heeft zal ziek zijn.<br><br> 
De dwang tot succes en geluk blijkt een keerzijde te hebben: het leidt tot verlies aan zelfbesef, tot desoriëntatie en vertwijfeling. De mens is eenzamer dan ooit. De liefde is moeilijk te bereiken en betekenisvol leven is diepgaand problematisch geworden. Vanuit zijn klinische ervaring als psychotherapeut laat Verhaeghe zien hoezeer de veranderde maatschappij doorwerkt in de hedendaagse individuele psychische problemen. Mensen komen met andere psychische klachten bij de psychiater dan voorheen.<br><br> 
<b>Over de auteur</b><br> 
Paul Verhaeghe (geb. 5 november 1955) is van opleiding klinisch psycholoog, van vorming psychoanalyticus. Zijn eerste doctoraat (1985) handelde over hysterie, zijn tweede (1992) over psychodiagnostiek. Hij werkt als gewoon hoogleraar aan de universiteit van Gent. Sedert 2000 gaat zijn belangstelling vooral naar de invloed van maatschappelijke veranderingen op psychologische en psychiatrische moeilijkheden. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_1.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 

<div id="tab2Content"> 
<table><tr><td class="text"> 
<b>Get your guts, je instinct als kompas – Hilde Bolt</b><br> 
Iemand met Guts is een persoon met lef, met ballen. Maar heeft lef te maken met de darmen ('gut' = 'darm'), met onze buik? Een heleboel. Ons buikgebied bevat veel meer wijsheid dan we denken. Guts heeft een dubbele betekenis: de signalen uit het buikgebied zijn het instrument, het kompas van waaruit je kunt leven. En Guts is de kracht die je nodig hebt om hiernaar te handelen. Het leven kan mooi, maar ook vol risico's en soms wreed zijn. We kunnen niet altijd kiezen wat onze weg kruist. Toch is het vaak mogelijk om lichter, speelser, creatiever en eenvoudiger met het leven om te gaan.<br><br> 
Get your Guts is een wake-up call, een herinnering aan je eigen oorsprong. De wijsheid van je lichaam, je buikgebied geeft je de mogelijkheid om oeroude instinctieve en verborgen kennis weer tot leven te brengen. Get your Guts is een boek voor mensen die zelf guts willen ontwikkelen, maar ook een boek dat iedere therapeut, coach of hulpverlener gelezen moet hebben. 
<br><br> 
<b>Over de auteur</b><br> 
Hilde Bolt werkt als zelfstandig gevestigd coach, counselor, trainer en psychotherapeut. Ze heeft zich bijgeschoold in oosterse en westerse vormen van lichaamsgericht werken. Tijdens de trainingen creëert ze een veilige, creativiteit bevorderende sfeer waarin veel ‘op maat’ geëxperimenteerd kan worden zodat een ieder op een eigen manier het optimale rendement uit de training kan halen. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_2.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 

<div id="tab3Content"> 
<table><tr><td class="text"> 
<b>Zin kun je maken - Ilse Vooren en Merlijn Koch</b><br> 
Vanaf nu is zingeving begrijpelijk en hanteerbaar. Zin kun je maken benadert zingeving als een vermogen, waarbinnen vaardigheden en competenties te ontwikkelen zijn. We hebben meer ruimte dan ooit om stil te staan bij de betekenis van onszelf en ons bestaan. Zingeving speelt in onze diepste lagen en vragen en werkt door in het alledaagse leven. Wanneer en hoe ervaar je zin? Dit boek maakt helder hoe zingevingsprocessen werken en wat de functie van zingeving is.<br><br> 
Zingeving hanteerbaar maken is belangrijk om richting te geven aan leven en werk. Voor coaches, leidinggevenden en andere professionals is praktische kennis van zingeving tegenwoordig essentieel. Het gesprek kunnen voeren op het niveau van betekenis is onderdeel van het nieuwe organiseren, leidinggeven en de zelfsturing van professionals. 
Dit boek geeft concrete handvatten om processen van zingeving te begeleiden, individueel en in organisaties. Je ontdekt hoe je kunt bijdragen aan ervaringen van zin in alle verschijningsvormen, zoals motivatie, betrokkenheid, voldoening, (eigen)waarde en betekenis.<br><br> 
<b>Over de auteurs</b><br> 
Ilse Vooren en Merlijn Koch zijn beiden humanisticus. Ilse is oprichter van Food for Flow en gespecialiseerd in zingeving, energie en performance. Merlijn is coach en trainer bij de landelijke coachorganisatie Resilians, met expertise in het vergroten van vitaliteit en veerkracht. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_3.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 

<div id="tab4Content"> 
<table><tr><td class="text"> 
<b>Mentaliserend Coachen – Peter Bleumer en René Meijer</b><br> 
Mentaliseren is het vermogen tot zelfreflectie en inleving, beide noodzakelijk om goed te functioneren op het werk en privé. Sommige mensen kunnen niet goed mentaliseren, en veel mensen die dit vermogen wel hebben, verliezen het als ze stress ervaren of emotioneel zijn.<br><br> 
Voor effectieve coaching en training is zelfreflectie van de deelnemers essentieel. Wat nu te doen als juist in dat gebrek aan mentaliserend vermogen het probleem schuilt? Dit praktische boek laat zien hoe mensen kunnen leren beter te mentaliseren. Het bevat concrete handvatten voor coaches, trainers en leidinggevenden voor het bevorderen hiervan. 
<br><br> 
<b>Over de auteurs</b><br> 
Ilse Vooren en Merlijn Koch zijn beiden humanisticus. Ilse is oprichter van Food for Flow en gespecialiseerd in zingeving, energie en performance. Merlijn is coach en trainer bij de landelijke coachorganisatie Resilians, met expertise in het vergroten van vitaliteit en veerkracht. 
</td> 
<td class="tops"> 
<img src="http://www.alumnei.nl/images/boekenactie_2017/boek_4.jpg" style="float: left; width: 120%; "> 
</td></table> 
</div> 
関連する問題