{"id":2871,"date":"2010-09-11T08:37:50","date_gmt":"2010-09-11T13:37:50","guid":{"rendered":"http:\/\/susangibb.net\/blog2\/?p=2871"},"modified":"2010-09-11T09:39:24","modified_gmt":"2010-09-11T14:39:24","slug":"hypertext-tinderbox-links-within-images","status":"publish","type":"post","link":"https:\/\/susangibb.net\/blog2\/2010\/09\/hypertext-tinderbox-links-within-images\/","title":{"rendered":"HYPERTEXT &#038; TINDERBOX: Links within Images"},"content":{"rendered":"<p><a href=\"https:\/\/susangibb.net\/blog2\/wp-content\/uploads\/2010\/09\/map.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2876\" title=\"map\" src=\"https:\/\/susangibb.net\/blog2\/wp-content\/uploads\/2010\/09\/map.jpg\" alt=\"\" width=\"793\" height=\"520\" srcset=\"https:\/\/susangibb.net\/blog2\/wp-content\/uploads\/2010\/09\/map.jpg 725w, https:\/\/susangibb.net\/blog2\/wp-content\/uploads\/2010\/09\/map-300x196.jpg 300w\" sizes=\"auto, (max-width: 793px) 100vw, 793px\" \/><\/a><\/p>\n<p><span class=\"drop\">I<\/span> recently started editing some of the hypertext stories I&#8217;d written last summer as part of the 100 Days Project. One of the things that I&#8217;ve done is add in an image of the mapping of the story to help guide those who are new to hypertext reading and may become frustrated. It&#8217;s also sort of a learning tool, I suppose. And yes, I&#8217;m also driven by that evil gene within some writers and artists that wants the reader to read all of the words so lovingly placed there; wants him to appreciate the perfect symmetry of the design. So what?<\/p>\n<p>Well in doing so, it occurred to me that it would be nice to allow the reader to select the point at which he wishes to return to the story, to see the path not taken and plunk himself down on it. With the old Storyspace reader, one may do so, follow the trail and go back&#8211;though I don&#8217;t believe the map image is shown. But we&#8217;re talking html on a website here. I have placed the map at the end of the stories (those I&#8217;ve gotten to so far), and while I&#8217;ve used a couple different ways of presenting it, the options at that point are usually to a) go back to the beginning of the piece, b) go back to the last page, or c) exit the piece. Wouldn&#8217;t it be great to offer d) a specific point within the plot?<\/p>\n<p>Which brings me to, how would one do it?<\/p>\n<p>Yes, I can link from an image to another lexia, but from points within the image? It seems that it should be easy enough with a map that shows boxes and words&#8211;just make a text link. (Though I work in <a href=\"http:\/\/eastgate.com\/Tinderbox\/index.html\">Tinderbox <\/a>now, rather than <a href=\"http:\/\/eastgate.com\/storyspace\/index.html\">Storyspace<\/a>, and so far, images aren&#8217;t a part of the plan.) But it doesn&#8217;t work that way; that&#8217;s not what shows up in html. It&#8217;s been done on the web of course, but I believe that&#8217;s done in Flash or some other manner. I&#8217;ve been told that much can be achieved by jQuery, HTML5, and CSS3. Guess it&#8217;s time to start checking that out, perhaps find a class somewhere so it doesn&#8217;t take me quite so long to learn it all.<\/p>\n<p>Like everything else in my personal experience, the answer is out there and sought, once the question comes to mind.<\/p>\n","protected":false},"excerpt":{"rendered":"<p><span class=\"drop\">I<\/span> recently started editing some of the hypertext stories I&#8217;d written last summer as part of the 100 Days Project. One of the things that I&#8217;ve done is add in an image of the mapping of the story to help guide those who are new to hypertext reading and may become frustrated. It&#8217;s also sort [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"nf_dc_page":"","footnotes":""},"categories":[5,14],"tags":[53,52],"class_list":["post-2871","post","type-post","status-publish","format-standard","hentry","category-hypertext","category-tinderbox","tag-hypertext","tag-tinderbox"],"_links":{"self":[{"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/posts\/2871","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/comments?post=2871"}],"version-history":[{"count":5,"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/posts\/2871\/revisions"}],"predecessor-version":[{"id":2879,"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/posts\/2871\/revisions\/2879"}],"wp:attachment":[{"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/media?parent=2871"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/categories?post=2871"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/susangibb.net\/blog2\/wp-json\/wp\/v2\/tags?post=2871"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}