The things you want to do have to be triggered by a button (or one of the other 3 widgets that can send messages).
I notice that the button widget can take a class attribute. So I'm wondering if you could replace the <a> anchors with <$button class="hike1" > with an action of some sort (like creating a new tiddler). You would have to change those references to *a#hiker1* to class references like* button.hike1*. Something worth trying? Mark On Sunday, January 1, 2017 at 3:09:12 PM UTC-8, Dave wrote: > > This is a further refinement of this thread > > > https://groups.google.com/forum/#!searchin/TiddlyWiki/CSS$20Alternative$20for$20an$20Image$20Map%7Csort:relevance/tiddlywiki/9G2Kv-TQkI0/2eY-4v9zIAAJ > > > I have this tiddler [[BodyDiagram]] > > <h1>a pain diagram</h1> > <div id="bodymap"> > <figcaption> > bla bla bla</figcaption> > <a href="http://www.yahoo.com/"; id="hiker1"></a> > <a href="http://www.bing.com/"; id="hiker2"></a> > <a href="http://www.google.com/"; id="hiker3"></a> > </div> > > > > with the CSS in this stylesheet tagged with $:/tags/Stylesheet: > > body { > background-color: #ABC; > color: #123; > font-family: verdana; > } > h1 { > margin-bottom: 20px; > text-align: center; > } > #bodymap { > background-image: url(images/BodyDiagram.png); > width: 449px; > height: 473px; > position: relative; > } > #bodymap a { > display: block; > border: 1px solid #FF2; > position: absolute; > } > #bodymap a:hover { > border: 1px solid #333; > } > a#hiker1 { width: 50px; height: 50px; left: 82px; top: 25px; } > a#hiker2 { width: 40px; height: 40px; left: 86px; top: 65px; } > a#hiker3 { width: 10px; height: 10px; left: 510px; top: 150px } > > #bodymap figcaption { > position: absolute; > top: 0px; left: 0px; > width: 449px; height: 20px; > line-height: 20px; > text-align: center; > font-weight: bold; > background-color: rgba(255,255,255,.6); > } > > > > and it looks like this: (see image provided) > > > > This is still in the process of converting from the original post so > that's why the hot spots are referred to as "hiker1" etc... > > Question: While clicking on the square around the head will open a link > to Yahoo.com in this example: > > (<a href="http://www.yahoo.com/"; id="hiker1"></a>) > > > **** how do I instead make something internal to the TW happen, e.g. > trigger a macro of some sort? * *** > > My ultimate goal is to click on a square and have a templated new tiddler > open up with appropriate fields set with things like "head" and <<today's > date>> > > Thanks, > Dave > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/4a704bfc-5992-4528-b32b-8d65d6dfa667%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
