I think I have this solved, just shows, walking away from something for a weekend and coming back to it with fresh eyes works!
Basically, I have added a filter to my functions.php to allow the formatting of the URL in the rel field for the custom menu
add_filter( 'sanitize_html_class', 'dont_filter_hash', 10, 2 );
function dont_filter_hash($sanitized, $raw) {
if(!preg_match("#^http(s)?://[a-z0-9-_.]+\.[a-z]{2,4}#i", $raw)) {
return $raw;
} else {
return $sanitized;
}
}
Then, in the javascript instead of the class ‘screenshot’ being added to the ahref, I have applied it to a link within the list
$(".screenshot a").hover(function(e){ as opposed to $("a.screenshot ").hover(function(e){
Now I can add images to a tool tip rollover for specific links in my Nav.
Ideally I’d love a custom field to feed this image url to the menu, but that sounds like a monster sized task!!!
For some reason this is only working on my localhost, I have uploaded the functions file to my live site, and it’s no longer working!
——–
Tweaked the code to this. And it works great now.
add_filter( 'sanitize_html_class', 'dont_filter_hash', 10, 2 );
function dont_filter_hash($sanitized, $raw) {
if (!preg_match('#^http?://[a-z0-9-._]+\.[a-z0-9]{2,4}$#i', $raw)) {
return $raw;
} else {
return $sanitized;
}
}
stephen_lsd
YOU ROCK!!!!!!! I am so thankful for finding this post, thank you so much for sharing this! totally made my mother’s day 🙂
YES!!!!!
great stuff… glad it works for you… took me a good while to solve it!!!
so check it! here’s where I implemented your fancy codework 😉
Custom WP Design Portfolio
I was trying to force the thumbs to be on the left of the menu items at the exact y coordinates; didn’t work out that way, but I still like it. I couldn’t use it with File Gallery plugin though, there was a javascript conflict – so I have to find something else for that, just using a temp gallery for now.
Nice site, looks really slick.
Strange how it won’t move to the right of your menu though.
#screenshot {
position:absolute;
margin-left: -125px;
border: 1px solid #573e38;
background: #735750;
padding:5px;
display:none;
color: #fefbf7;
}
I think I was able to move mine around by altering the margin-left.
yea, i added that margin so it wouldn’t move to the right, I didn’t want it to be hidden if the browser was smaller. But since it’s going off the mouse movement it doesn’t allow the screenshots to be at an exact y coordinate. I haven’t really researched it enough to see if it’s possible yet though.