MM October 2024

by enbette

HTML

<div class="magazineContainer">

    <select id="pageSelector" name="PageSelector" style="border: 1px solid #e6e6e6; padding: 2px; border-radius: 3px; margin-bottom: 10px; width: 100%;">
	<!-- Below are the pages in the dropdown menu at the top -->
	<!-- You can change the text of 'Page 1' etc. to something else, so people know what page they're jumping to -->
	<!-- To add more options, copy the line saying <option>...</option> and paste it directly underneath -->
	<!-- Change the values 'p0', 'p1' etc. to match, they need to be in order and counting up -->
        <option disabled="disabled" selected="selected" value="">Jump to a page</option>
        <option value="p0">Cover</option>
        <option value="p1">MOTM: Member Of The Month</option>
        <option value="p2">Game Releases</option>
        <option value="p3">Selfcare tips</option>
        <option value="p4">Riddles</option>
        <option value="p5">Click game</option>
        <option value="p6">Help us</option>
        <option value="p7">A Special thanks</option>
        <option value="p8">The End</option>
    </select>

	<div class="pagesContainer">
	
		<!-- FRONT COVER -->
  		<!-- Change the url() to your front cover URL -->
  		<div id="page_0" class="pages" style="background: url(https://i.imgur.com/UMFwCgy.png) top right no-repeat;">
  			<div class="goForth next arrow" style="color: #000;"><span class="arrowSize">→</span></div>
 		</div>

		<!-- Below is the first page of the magazine, notice the first line says 'page_1'-->
  		<!-- Your image should be 688px in width and 500px in height -->
  		<!-- You can put the html from your layout and text between 'ARTICLE START' and 'ATICLE END' --> 

  		<!-- PAGE 1 -->
  		<div id="page_1" class="pages">
			<!-- Article Start --><div style="overflow: hidden; width: 688px; height: 500px;">
<iframe style="overflow: hidden; margin-top: -58px; margin-left: -8px;" src="//jsfiddle.net/jevb9zkL/embedded/result" frameborder="0" width="750"...

CSS

.goForth.back{
    background-image: url('https://i.imgur.com/Qm5XefS.png');
    
}