0 votes
by (180 points)
Hey !

Since I'm doing a visual novel on Twine (An incredible mess), I configure the passages, but I can't place my icon to pass the dialogs (like in real games).


It's an little arrow (4 frames gif), and i want to stick it on the passage. She's actually at the end of the sentence, and I want her to stay in the same place.


Here's the code. It's juste a basic markup. I tried to put it in a macro with a left/top position but it doesn't work, I can't combine image/passage/macro.

I'm kind of stuck on that one. Thanks in advance for the answer!

1 Answer

+1 vote
by (44.7k points)
edited by

It's hard to answer that question since it depends on a lot of things, such as the HTML code surrounding it and your CSS.

Usually, for things like that, I right-click on the element, choose "Inspect" from the pop-up menu, and then play around with the CSS in the inspector until I figure out how to make the CSS display it the way I want it to.

Hope that helps! smiley

by (180 points)

Thanks ! But it seems doesn't work...


The image is present but is not displayed. And it looks like it displays two of them (Plus the one at the top is not clickable)



if (window.hasOwnProperty("storyFormat")) {
	setup.Path = "Desktop/Tomodomo/image/";  // Twine
} else { 
	setup.Path = "image/"; // Desktop

<img style="z-index: 1; position: absolute; left: 760px; top: -426px;" src="image/corey.gif" >

''Gall'' : Omg, how rude man !<br>

<img @src="setup.Path+'arrow.gif'" img style="z-index: 10; position: absolute; left: 10em; top: -17em;">


I've wrote the code down here. 

I've try to use a script to activate the gif too, but it doesn't work too.

by (44.7k points)
That looks like a "broken image link" icon.  So you might want to check the path.

Also, the code you're showing there is what I wrote when I initially misread the question.  As you can see above I have since edited it.
by (180 points)

OKAY, so, thanks for the help ! I just figured out... I just used a <link> and everything worked like magic.

Here's the code :

<<link '<img style="z-index: 1; position: absolute; left: 760px; top: -426px;" src="image/arrow.gif">' 10>><</link>>


The 10 is the name of the passage. And the arrow stick in the right position (Very useful for sticky textbox).