On my static Hugo website I need the word "Critique" in the bottom of my sticky header on List.html page of the critique section and on the single.html of the section before scrolling. But on scrolling I would like to add the article title only on the single.html page but not on the list.html page. This is the logic I need somewhere in my partials/page-title.html
{{ $page-scroll := "no-scroll" }}
<script>
$(window).on("scroll", function () {
if ($(this).scrollTop() > 150) {
${page-scroll} = "scroll";
}}
</script>
<section class="page-title">
<div class="container">
<div class="row">
<div class="col-10">
{{ if eq .Section "critique" }} <h3>Critique {{ if eq $page-scroll "scroll" }} / {{ .Title}} {{end}}</h3> {{ end }}
</div>
</div>
</div>
</section>
Unfortunately the script doesn't change $page-scroll variable. What am I doing wrong?
Hugo variables are referenced like this:
{{ $page-scroll }}
However, you are looking for something like this:
<script>
$(window).on("scroll", function () {
if ($(this).scrollTop() > 150) {
document.getElementById('showme').style.display = 'inline';
}}
</script>
{{ if eq .Section "critique" }}
<h3>Critique<span id="showme" style="display: none;"> / {{ .Title}}</span></h3>
{{ end }}