Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Daniel's Intro Website</title>
        <script src="js/jquery-3.1.0.min.js"></script>
        <script src="js/main.js"></script>
        <link rel="stylesheet" type="text/css" href="css/w3.css">
        <link rel="stylesheet" type="text/css" href="css/main.css"/>
    </head>
​
    <body>
        <div id="banner">
            <img id="bannerpic" src="images/graded.JPG" alt="class.jpg">
            <h1 id="Welcome">Welcome!</h1>
            <h4>Created by Daniel C.</h4>
​
            <input id="aboutme" type="button" value="About Me!">
            <div id="infoaboutme">
                <p>I am a Junior at Mountain View High School.</p>
                <p>I like to learn at school.</p>
                <p>I love to spend time on the computer</p>
            </div>
​
            <br class="clearfloat">
        </div>
​
        <div>
            <ul class="w3-navbar w3-card-2 w3-grey">
                <li>
                    <a href="http://192.168.1.100/a2school">Mr. M</a>
                </li>
                <li>
                    <a href="http://192.168.1.113/a2carlson">Home</a>
                </li>
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">My Favs<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://google.com">Google</a>
                        <a href="http://twitch.tv">Twitch</a>
                        <a href="http://youtube.com">Youtube</a>
                    </div>
                </li>
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">CHS<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://192.168.1.104/a2school">Eli T</a>
                        <a href="http://192.168.1.105/a2school">Ashley X</a>
                        <a href="http://192.168.1.115/a2school">Andrew H</a>
                        <a href="http://192.168.1.106/a2school">Savannah C</a>
                        <a href="http://192.168.1.107/a2school">Robert G</a>
                    </div>
                </li>
​
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">EHS<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://192.168.1.123/a2school">Ethan P</a>
                        <a href="http://192.168.1.169/a2school">Richard M</a>
                    </div>
                </li>
​
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">MA<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://192.168.1.103/a2school">Bryan H</a>
                    </div>
                </li>
​
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">MHS<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://192.168.1.112/a2school">Tyler P</a>
                        <a href="http://192.168.1.114/a2school">Neomi B</a>
                        <a href="http://192.168.1.116/a2school">Tanis S B</a>
                        <a href="http://192.168.1.130/a2school">Nicole C</a>
                        <a href="http://192.168.1.124/a2school">Vic S</a>
                    </div>
                </li>
​
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">MVHS<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://192.168.1.113/a2school">Daniel C</a>
                        <a href="http://192.168.1.121/a2school">Brendon S</a>
                        <a href="http://192.168.1.122/a2school">Micah G</a>
                    </div>
                </li>
​
                <li class="w3-dropdown-hover w3-hover-light-grey">
                    <a class="w3-hover-grey" href="#">RHS<i class="fa fa-caret-down"> </i></a>
                    <div class="w3-dropdown-content w3-white w3-card-4">
                        <a href="http://192.168.1.120/a2school">Cole P</a>
                        <a href="http://192.168.1.108/a2school">Andrew W</a>
                        <a href="http://192.168.1.107/a2school">Alexis B</a>
                        <a href="http://192.168.1.110/a2school">Chase S</a>
                        <a href="http://192.168.1.152/a2school">David B</a>
                    </div>
                </li>
            </ul>
        </div>
​
        <div id="wrapper">
            <div id="leftpanel">
                <p>Test left float</p>
            </div>
​
            <div id="rightpanel">
                <p>This is a test right float</p>
            </div>
​
            <div id="middlepanel">
                <h1 class="center">Pictures taken for and of class!</h1>
                <div id="slideShow" class="w3-content" style="max-width:600px;position:relative">
                    <div>
                        <div class="w3-display-container mySlides">
                            <img src="images/code.png" style="width:100%" height="360px" alt="code.jpg">
                            <div class="w3-display-bottomleft w3-large w3-container w3-padding-16 w3-black">
                                Code
                            </div>
                        </div>
​
                        <div class="w3-display-container mySlides">
                            <img src="images/class.JPG" style="width:100%" height="360px" alt="class.jpg">
                            <div class="w3-display-bottomleft w3-large w3-container w3-padding-16 w3-black">
                                Class
                            </div>
                        </div>
​
                        <div class="w3-display-container mySlides">
                            <img src="images/graded.JPG" style="width:100%" height="360px" alt="graded.jpg">
                            <div class="w3-display-bottomleft w3-large w3-container w3-padding-16 w3-black">
                                Class
                            </div>
                        </div>
                        <a class="w3-btn-floating w3-hover-dark-grey" style="position:absolute;top:45%;left:0" onclick="plusDivs(-1)">[</a>
                        <a class="w3-btn-floating w3-hover-dark-grey" style="position:absolute;top:45%;right:0" onclick="plusDivs(1)">]</a>
                        <script src="js/slideshow.js"></script>
​
                    </div>
                </div>
​
                <h1 class="center">Videos for the class!</h1>
                <div class="videoleft">
                    <video width="100%" height="100%" controls>
                        <source src="videos/video_converted.ogg" type="video/ogg">
                        <source src="videos/video_converted2.webm" type="video/webm">
                        <source src="videos/video_converted3.webm" type="video/webm">
                        Your browser does not support the video tag.
                    </video>
                </div>
​
                <div class="videoright">
                    <video width="100%" height="100%" controls>
                        <source src="#" type="video/ogg">
                        <source src="#" type="video/webm">
                        <source src="#" type="video/webm">
                        Your browser does not support the video tag.
                    </video>
                </div>
            </div>
​
            <div id="footer">
                <h3>Stest</h3>
            </div>
        </div>
​
    </body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
mandar262pro
0viewers