feingeist Posted June 17, 2020 Share Posted June 17, 2020 (edited) Hi Guys, I'm trying to replace the last two items in my main nav with Icons. I did it before with the "Five" template and I used this code: <script> $("nav#main-navigation > ul > li:nth-last-child(1) a").replaceWith($(iconEN)); $("nav#main-navigation > ul > li:nth-last-child(2) a").replaceWith($(iconDE)); </script> The problem is that I can't use the same code with the "Mentor" template since the structure seems to be different from "Five" If I inspect the main nav on my "Mentor" template it shows something like this: <a href="#" class="Header-nav-item">DE</a> Can you guys help me with figuring out how I need to change my code so it works for the "Mentor" template? All the best Feingeist Edited June 17, 2020 by feingeist Link to comment
feingeist Posted June 17, 2020 Author Share Posted June 17, 2020 I got it to work with this code: <img id="iconEN" src="/s/ENgreyNewVer1.svg" title="Englisch" onclick="switchLang('en');" style="cursor: pointer; margin-top:10px; margin-left:15px; height:20px; width:30px;"/> <img id="iconDE" src="/s/DEgreyNewVer1.svg" title="Deutsch" onclick="switchLang('de');" style="cursor: pointer; margin-top:10px; margin-left:10px; height:20px; width:30px;"/> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script> $("a.Header-nav-item:nth-last-child(1)").replaceWith($(iconEN)); $("a.Header-nav-item:nth-last-child(2)").replaceWith($(iconDE)); </script> The only problem seems to be the margins seem to not to anything. I need to align the icons to the rest of the navigation 😕 Link to comment
feingeist Posted June 18, 2020 Author Share Posted June 18, 2020 I figured the margin problems out by using this instead: position:relative; top:4px; Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment