How to avoid jquery library from effecting my css


Tags: jquery,css,jquery-ui

Problem :

I have a div with nav buttons and dropdowns with a photo slider below it which uses requires the inclusion of jquery.min.js.

When I include jQuery it effects my CSS preventing my dropdowns from expanding open.

<div id="sticky_navigation">
  <ul class="menumix">
    <li><a href="index.php"><img src="images/home_icon.png"></a></li>
    <li><a href="page.php">VIDEOS</a></li>
    <li><a href="#">LANGUAGE<span class="dc-mega-icon"></span></a>
    <ul class="sub">
      <li><a href="setcookies.php?id=5">English</a></li>
      <li><a href="setcookies.php?id=6">Malayalam</a></li>
    </ul>
  </ul> 
</div>

<script type='text/javascript' src='slider/scripts/jquery.min.js'></script>
 <div id="slider_main">     
  <div id="fluid_container">
    <div class="camera_wrap" id="camera_wrap_1">
      <div data-src="slider/slides/">
      </div>     
    </div>
  </div> 
</div>


Solution :

I fixed this issue by adding some simple css code for the dropdown i.e

ul li:hover ul
 {
  display: block;
  opacity: 1;
  visibility: visible;
}

Earlier the dropdown was working without this code but now after adding the new slider i need to add this additional code to show the dropdwon. Thank you all who gave some idea's to solve this issue.


    CSS Howto..

    How can I make a circle using css and apply it to my header?

    How to add css for div tag and Panel in asp

    How to get a frame off animated png using CSS?

    Codeigniter--add “active” css class to link, how to?

    How do i vertically align my form in bootstrap?

    How do I add a link to my CSS background?

    How to make a full width image responsive

    How to set margin for elements in my case

    How to target div within a modal box with CSS

    How to write below CSS lines in zend framework 2 syntax?

    How do I put these on the same line?

    How to override the computed style in css?

    How can I style this span for a quote without causing this layout problem?

    How to change css href=“” using javascript? [duplicate]

    How can I prevent the Featherlight lightbox from creating recursive dialogs?

    How to create a responsive popup using fancybox 2?

    How to add style to words (HTML/CSS)

    How to align 3 child div in a parent div

    How to define specific CSS rules for IE9 alone?

    How can I get these span elements to expand to fill their full height?

    How can I make this work?

    How to add padding to the outside of an input in css

    how to handle spanish character for classname in CSS file?

    How to unbind element then allow that element to bind again

    How to change inline css using jquery in joomla

    How can i overlap inline divs?

    Css how to replace block after click button

    CSS How to use margins with different divs

    How to set a CSS settings only to the td of an external table but not to the internal table?

    How to include library files (css/js) in angular-fullstack based app