{"id":23825,"date":"2022-11-28T14:39:46","date_gmt":"2022-11-28T09:09:46","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/"},"modified":"2022-11-28T14:39:46","modified_gmt":"2022-11-28T09:09:46","slug":"solved-hide-a-when-navigation-link-is-hovered-closed","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/","title":{"rendered":"[Solved] hide a when Navigation link is Hovered [closed]"},"content":{"rendered":"

[ad_1]
\n<\/p>\n

\n
\n
<\/div>\n
\n
\n

You could use JavaScript, something like this:<\/p>\n

<a href=\"#\" id=\"hoverthis\" onmouseover=\"document.getElementById(\"disappear\").style.display=\"none\";\">When you over this, the second div with disappear.<\/a>\n\n<p id=\"disappear\">I will disappear when hoverthis is hovered.<\/p>\n<\/code><\/pre>\n
The script above sets the element (in this case, the p<\/code>) to make apply the CSS code display:none<\/code> to the div with the id disappear<\/code>. You could set JavaScript to apply any CSS property to wanted, virtually. Like you could use JavaScript to make the div reappear. This could also be accomplished with jQuery, like this:<\/p>\n
$('#disappear').hide();\n<\/code><\/pre>\n
or to remove from the DOM:<\/p>\n
$('#disappear').remove();\n<\/code><\/pre>\n
or to make it reappear:<\/p>\n
$('#disappear').show();\n<\/code><\/pre>\n
This is shorthand. You could also set jQuery to do something like this:<\/p>\n
$('#disappear').css(\"display\",\"none\");\n<\/code><\/pre>\n
And with the code above, like the pure JavaScript solution, could be edited to apply any CSS property.<\/p>\n
You can edit this script to suit your needs. Tell me if this works, or if you need further help.<\/p>\n
If this helps you, remember to click the check near this answer. It would really help. Thanks. \ud83d\ude42<\/p>\n<\/p><\/div>\n
<\/div>\n<\/div>\n
            <\/span> <\/p><\/div>\n<\/div>\n
[ad_2]<\/p>\n
solved hide a <\/p>\n
 when Navigation link is Hovered [closed] <\/p>\n","protected":false},"excerpt":{"rendered":"
[ad_1] You could use JavaScript, something like this: <a href=”#” id=”hoverthis” onmouseover=”document.getElementById(“disappear”).style.display=”none”;”>When you over this, the second div with disappear.<\/a> <p id=”disappear”>I will disappear when hoverthis is hovered.<\/p> The script above sets the element (in this case, the p) to make apply the CSS code display:none to the div with the id disappear. You could … Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[320],"tags":[464,1918,346,388,5095],"class_list":["post-23825","post","type-post","status-publish","format-standard","hentry","category-solved","tag-css","tag-drupal","tag-html","tag-jquery","tag-superfish"],"yoast_head":"\n[Solved] hide a when Navigation link is Hovered [closed] - JassWeb<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[Solved] hide a when Navigation link is Hovered [closed] - JassWeb\" \/>\n<meta property=\"og:description\" content=\"[ad_1] You could use JavaScript, something like this: <a href="#" id="hoverthis" onmouseover="document.getElementById("disappear").style.display="none";">When you over this, the second div with disappear.<\/a> <p id="disappear">I will disappear when hoverthis is hovered.<\/p> The script above sets the element (in this case, the p) to make apply the CSS code display:none to the div with the id disappear. You could ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\" \/>\n<meta property=\"og:site_name\" content=\"JassWeb\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-28T09:09:46+00:00\" \/>\n<meta name=\"author\" content=\"Kirat\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirat\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\"},\"author\":{\"name\":\"Kirat\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\"},\"headline\":\"[Solved] hide a when Navigation link is Hovered [closed]\",\"datePublished\":\"2022-11-28T09:09:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\"},\"wordCount\":159,\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"keywords\":[\"css\",\"drupal\",\"html\",\"jquery\",\"superfish\"],\"articleSection\":[\"Solved\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\",\"url\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\",\"name\":\"[Solved] hide a when Navigation link is Hovered [closed] - JassWeb\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#website\"},\"datePublished\":\"2022-11-28T09:09:46+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jassweb.com\/solved\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[Solved] hide a when Navigation link is Hovered [closed]\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jassweb.com\/solved\/#website\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"name\":\"JassWeb\",\"description\":\"Build High-quality Websites\",\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jassweb.com\/solved\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\",\"name\":\"Jass Web\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"contentUrl\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"width\":693,\"height\":132,\"caption\":\"Jass Web\"},\"image\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\",\"name\":\"Kirat\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1776403586\",\"contentUrl\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1776403586\",\"caption\":\"Kirat\"},\"sameAs\":[\"http:\/\/jassweb.com\"],\"url\":\"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[Solved] hide a when Navigation link is Hovered [closed] - JassWeb","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/","og_locale":"en_US","og_type":"article","og_title":"[Solved] hide a when Navigation link is Hovered [closed] - JassWeb","og_description":"[ad_1] You could use JavaScript, something like this: <a href=\"#\" id=\"hoverthis\" onmouseover=\"document.getElementById(\"disappear\").style.display=\"none\";\">When you over this, the second div with disappear.<\/a> <p id=\"disappear\">I will disappear when hoverthis is hovered.<\/p> The script above sets the element (in this case, the p) to make apply the CSS code display:none to the div with the id disappear. You could ... Read more","og_url":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/","og_site_name":"JassWeb","article_published_time":"2022-11-28T09:09:46+00:00","author":"Kirat","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirat","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/#article","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/"},"author":{"name":"Kirat","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31"},"headline":"[Solved] hide a when Navigation link is Hovered [closed]","datePublished":"2022-11-28T09:09:46+00:00","mainEntityOfPage":{"@id":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/"},"wordCount":159,"publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"keywords":["css","drupal","html","jquery","superfish"],"articleSection":["Solved"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/","url":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/","name":"[Solved] hide a when Navigation link is Hovered [closed] - JassWeb","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/#website"},"datePublished":"2022-11-28T09:09:46+00:00","breadcrumb":{"@id":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jassweb.com\/solved\/solved-hide-a-when-navigation-link-is-hovered-closed\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jassweb.com\/solved\/"},{"@type":"ListItem","position":2,"name":"[Solved] hide a when Navigation link is Hovered [closed]"}]},{"@type":"WebSite","@id":"https:\/\/jassweb.com\/solved\/#website","url":"https:\/\/jassweb.com\/solved\/","name":"JassWeb","description":"Build High-quality Websites","publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jassweb.com\/solved\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jassweb.com\/solved\/#organization","name":"Jass Web","url":"https:\/\/jassweb.com\/solved\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/","url":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","contentUrl":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","width":693,"height":132,"caption":"Jass Web"},"image":{"@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31","name":"Kirat","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/","url":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1776403586","contentUrl":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1776403586","caption":"Kirat"},"sameAs":["http:\/\/jassweb.com"],"url":"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/"}]}},"_links":{"self":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/23825","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/comments?post=23825"}],"version-history":[{"count":0,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/23825\/revisions"}],"wp:attachment":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/media?parent=23825"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/categories?post=23825"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/tags?post=23825"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}