Hovedside: Forskjell mellom sideversjoner
Ingen redigeringsforklaring |
Ingen redigeringsforklaring |
||
Linje 69: | Linje 69: | ||
</div> | </div> | ||
<div class="w3- | |||
<div class="w3-row"> | |||
<div class="w3-half"> | |||
</button> | <h4>Accordions</h4> | ||
<button class="w3-padding-16 w3-button w3-block w3-left-align w3-red w3-hover-pink" onclick="myFunc('Demo5')">Accordion 1 <i class="fa fa-caret-down"></i></button> | |||
<div class="w3-hide w3-card" id="Demo5"> | |||
<a class="w3-button w3-block w3-left-align" href="javascript:void(0)">Link 1</a> | |||
<a class="w3-button w3-block w3-left-align" href="javascript:void(0)">Link 2</a> | |||
<a class="w3-button w3-block w3-left-align" href="javascript:void(0)">Link 3</a> | |||
</div> | |||
<button class="w3-padding-16 w3-button w3-block w3-left-align w3-red w3-hover-pink" onclick="myFunc('Demo4')">Accordion 2 <i class="fa fa-caret-down"></i></button> | |||
<div class="w3-hide w3-card" id="Demo4"> | |||
<div class="w3-container"> | |||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> | |||
</div> | </div> | ||
</div> | </div> | ||
</div> | |||
<div class="w3-half"> | |||
<div class="testmargin"> | |||
<h4>Dropdowns</h4> | |||
<div class="w3-dropdown-click" style="margin-bottom: 73px;"> | |||
<button class="w3-button w3-red w3-hover-pink w3-padding-16" onclick="myFunction()">Dropdown <i class="fa fa-caret-down"></i></button> | |||
<div class="w3-dropdown-content w3-card" id="myDropdown"> | |||
<a style="color: rgb(0, 0, 0);" href="javascript:void(0)">Link 1</a> | |||
<a style="color: rgb(0, 0, 0);" href="javascript:void(0)">Link 2</a> | |||
<a style="color: rgb(0, 0, 0);" href="javascript:void(0)">Link 3</a> | |||
</div> | |||
</div> | |||
</div> | |||
<script> | |||
/* When the user clicks on the button, | |||
toggle between hiding and showing the dropdown content */ | |||
function myFunction() { | |||
var x = document.getElementById("myDropdown"); | |||
if (x.classList) { | |||
x.classList.toggle("w3-show"); | |||
} else { | |||
// Fallback for IE9 | |||
var classes = x.className.split(" "); | |||
var i = classes.indexOf("w3-show"); | |||
if (i >= 0) | |||
classes.splice(i, 1); | |||
else | |||
classes.push("w3-show"); | |||
x.className = classes.join(" "); | |||
} | |||
} | |||
</script> | |||
</div> | |||
</div> | |||
__NOTOC__ | __NOTOC__ |
Sideversjonen fra 9. jan. 2018 kl. 15:03
Velkommen til Arkiwiki - Seksjon for dokumentasjonsforvaltning
Aktuelt
Brukerstøtte ePhorte
Styrebehandling og godkjenning
eDF - ePhorte digital forsendelse
Saksbehandlernes rutiner
Arkivets rutiner
Accordions
<button class="w3-padding-16 w3-button w3-block w3-left-align w3-red w3-hover-pink" onclick="myFunc('Demo5')">Accordion 1 </button>
<a class="w3-button w3-block w3-left-align" href="javascript:void(0)">Link 1</a> <a class="w3-button w3-block w3-left-align" href="javascript:void(0)">Link 2</a> <a class="w3-button w3-block w3-left-align" href="javascript:void(0)">Link 3</a>
<button class="w3-padding-16 w3-button w3-block w3-left-align w3-red w3-hover-pink" onclick="myFunc('Demo4')">Accordion 2 </button>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Dropdowns
<button class="w3-button w3-red w3-hover-pink w3-padding-16" onclick="myFunction()">Dropdown </button>
<a style="color: rgb(0, 0, 0);" href="javascript:void(0)">Link 1</a> <a style="color: rgb(0, 0, 0);" href="javascript:void(0)">Link 2</a> <a style="color: rgb(0, 0, 0);" href="javascript:void(0)">Link 3</a>
<script> /* When the user clicks on the button, toggle between hiding and showing the dropdown content */ function myFunction() {
var x = document.getElementById("myDropdown"); if (x.classList) { x.classList.toggle("w3-show"); } else { // Fallback for IE9 var classes = x.className.split(" "); var i = classes.indexOf("w3-show");
if (i >= 0) classes.splice(i, 1); else classes.push("w3-show"); x.className = classes.join(" "); }
} </script>