0 votes
by (790 points)

What I want is for the text revealed by a linkappend to briefly flash red when the player clicks on the linkappend, then return after a few seconds to the default black. The only example I can think of now is Liza Daly's The Ballroom - when you click on a linkappend/linkreplace, the new words are shown briefly in a different colour before taking on the same colour as the rest of the text. Can this be done?

1 Answer

+1 vote
by (41.9k points)

Not quite sure if this is your looking for, but if it's not, it should at least give you an idea how to get it.

Simply put this in your Stylesheet section:

.macro-linkreplace-in {
	opacity: 1 !important;
}
.macro-linkreplace-insert {
	transition: opacity 0.5s 2s ease-in;
	color: red;
	opacity: 0;
}

The "2s" means a two second delay before the transition, and then the "0.5s" means transition to complete transparancy in half a second.

That will affect all <<linkreplace>> macros in your game.

Unfortunately, you can't use the same trick with <<linkappend>> because it works differently, so you'll have to use <<linkreplace>> instead of that.

Hope that helps!  :-)

by (790 points)
This doesn't work, sorry. When I click on the link text it completely disappears. I tried this on the default sugarcube interface and I got the same result.
by (41.9k points)

Ah, sorry, you have to use the "t8n" (transition) version.  Something like this:

<<linkreplace "You'll //never// take me alive!" t8n>>On second thought, don't hurt me.<</linkreplace>>

should work.

by (790 points)
Thanks for the reply. Right now it flashes red, which is what I want, but fades away after a 2s delay. Is there a way to have it flash red and then fade from red to black? Sorry if I didn't make this clear from the beginning.
by (41.9k points)

Ah, I assumed you had the default black background and wanted it to fade out, so I had the CSS change the opacity.

This version will fade from red to black:

.macro-linkreplace-in {
	color: red !important;
}
.macro-linkreplace-insert {
	transition: color 0.5s 2s ease-in;
	color: black;
}

And, as I mentioned before, you can change the parameters of the "transition" property to affect how long it stays red and how quickly it transitions to black.

Enjoy!  :-)

by (790 points)
edited by

Thanks so much! That's exactly what I wanted. If I may ask another question: is it possible to make linkappend words not flash red (i.e. stay black)? I'd like only new text to flash red so I can call attention to them. In a case like this, for example:

Life was <<linkreplace "good." t8n>> good. Crime was low; few, if any, went hungry.<</linkreplace>>

The whole phrase within the linkreplace tags flashes red, whereas I would only like the "Crime was low; few, if any, went hungry" part to do so (not the word "good"). Is this possible? Thanks again!

by (790 points)
Could someone answer my question, please?
by (41.9k points)

Sorry, I don't use email notifications and I don't normally check old posts which I think were answered already.

For what you described I think you want this CSS instead then:

.macro-linkreplace-in span {
	color: red !important;
}
.macro-linkreplace-insert span {
	transition: color 0.5s 2s ease-in;
	color: black;
}

With that you can get what you want like this:

Life was <<linkreplace "good." t8n>>good. <span>Crime was low; few, if any, went hungry.</span><</linkreplace>>

That way, only the stuff within the <span> will flash red.

Hope that helps!  :-)

by (790 points)
Thank you so much :-) I assumed you didn't have an answer.
Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.
...