diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css
index eb5a5d935e2..28df8d3f011 100644
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -1547,10 +1547,23 @@ instead, we check that it's not a "finger" cursor.
margin-left: 24px;
}
+@keyframes targetfadein {
+ from {
+ background-color: var(--main-background-color);
+ }
+ 10% {
+ background-color: var(--target-border-color);
+ }
+ to {
+ background-color: var(--target-background-color);
+ }
+}
+
:target {
padding-right: 3px;
background-color: var(--target-background-color);
border-right: 3px solid var(--target-border-color);
+ animation: 0.65s cubic-bezier(0, 0, 0.1, 1.0) 0.1s targetfadein;
}
.code-header a.tooltip {
diff --git a/tests/rustdoc-gui/target.goml b/tests/rustdoc-gui/target.goml
index 82bd34ed274..92846f8e01d 100644
--- a/tests/rustdoc-gui/target.goml
+++ b/tests/rustdoc-gui/target.goml
@@ -11,7 +11,7 @@ define-function: (
[theme, background, border],
block {
call-function: ("switch-theme", {"theme": |theme|})
- assert-css: ("#method\.a_method:target", {
+ wait-for-css: ("#method\.a_method:target", {
"background-color": |background|,
"border-right": "3px solid " + |border|,
})