Например,есть экран регистрации и есть экран непосредственно показа контентаЗначит контент не должен быть читаем до регистрации, а значит он вообще не должен попадать в браузер ни в каком виде. Только после прохождения регистрации. Минимум два файла, или один но с использованием функционально части на сервере. А в этом случае все очень просто и примеров масса.
$head="<!DOCTYPE html><html><head><meta charset=\"utf-8\">
if(strpos($html,"$(")!==FALSE){ // сочетание $( или jQuery( всегда есть в кодах jQuery
$head.="<script type=\"text/javascript\" src=\"js/jquery-2.1.4.min.js\"></script>";
}
$head.="</head>"; // и так далееdiv.some-block{
background:url('some.img')no-repeat center;
background-size: contain;
}<div class="scroll-container" style="width:200px;height:200px;overflow:auto">
<div class="scroll-text-block">
<p>дофигакакогонибудьтекста</p>
<p>оченьдофига</p>
<img src="https://school-php.com/img/blogs/test1.png">
</div>
</div>(function(s) {
var n;
s(".tabs li").on("click", "li:not(.active)", function() {
n = s(this).parents(".tabs_block"), s(this).dmtabs(n)
}),
s.fn.dmtabs = function(n) {
s(this).addClass("active").siblings().removeClass("active"), n.find(".box").eq(s(this).index()).show(1, function() {
s(this).addClass("open_tab")
}).siblings(".box").hide(1, function() {
s(this).removeClass("open_tab")
})
}
})(jQuery);$('body').click(function(){
// Любой свой код
});<div>
<div style="float:left"><a href="#1"><img src="path/to/first.img"><br>Подпись1</a></div>
<div style="float:left"><a href="#2"><img src="path/to/second.img"><br>Подпись2</a></div>
<div style="float:left"><a href="#3"><img src="path/to/third.img"><br>Подпись3</a></div>
<hr style="clear:both;">
<div><a name="1"></a><img src="path/to/big-first.img"><p>Какой нибудь текст описания 1</p></div>
<div><a name="2"></a><img src="path/to/big-second.img"><p>Какой нибудь текст описания 2</p></div>
<div><a name="3"></a><img src="path/to/big-third.img"><p>Какой нибудь текст описания 3</p></div>
</div>