neocities/views/tutorial/html/6.erb
2015-12-14 14:55:33 -08:00

38 lines
1.5 KiB
Text

<div class="comic" style="height: 600px; background-image: url(/img/tutorial/ch1pg6.png); background-size: 650px">
<div class="dialogue" style="top: 120px; left: 40px">
Great job! You can see what you've done so far at <a href="">victoria.neocities.org</a>. Now let's try an image.
</div>
<div class="dialogue" style="top: 20px; left: 360px">
Your Neocities web directory already includes a portrait of me called <strong>cat.png</strong>.
</div>
<div class="dialogue" style="top: 140px; left: 410px">
Add it to your page like so: <strong>&lt;img src="/cat.png"&gt;</strong>
</div>
<div class="dialogue" style="top: 230px; left: 420px">
That's it! No closing tag needed for images.
</div>
</div>
<div class="welcome">
<h4>Links and Images</h4>
<p>If the page or image you're referring to is already in your Neocities web directory, you can call it by its filename: for example, index.html or cat.png.</p>
<p>Otherwise, use the full URL: http://neocities.org/img/heartcat.png</p>
</div>
<script>
function checkHomework() {
var html = editor.getValue()
/* TODO: Make .+ ignore any spaces or newlines or whatever. </a> lol </p> is fine too. */
var match = '<html.+>.+<body>.+<img.+src="/cat.png">.+</body>.+</html>'
var re = new XRegExp(match, 'gis')
if(html.match(re) === null) {
notok("That's not right! Try again.")
} else {
sessionStorage.setItem('tutorialHtml', html)
ok('Great, you did it!', '/tutorial/html/7')
}
}
</script>