IE only JQuery script is not firing off

Question

I have the following script:

<!--[if IE]>
    <script type="text/javascript">
    $(document).ready(function () {
    alert("ie");
    $('#usa').mapster({
        fillOpacity: 0.1,
        render_highlight: {
            fillColor: '2aff00',
            stroke: false,
            altImage: 'theImages/skillsets.png'
        },
        render_select: {
            fillColor: 'ff000c',
            stroke: false,
            altImage: 'theImages/skillsets.png'
        },
        fadeInterval: 50
    });
    });
    </script>
    <![endif]-->
    <script>
    $(document).ready(function () {
    $('#usa').mapster({
        fillOpacity: 0.1,
        render_highlight: {
            fillColor: '2aff00',
            stroke: false,
            altImage: 'theImages/skillsets.png'
        },
        render_select: {
            fillColor: 'ff000c',
            stroke: false,
            altImage: 'theImages/skillsets.png'
        },
        fadeInterval: 50
    });
    });
    </script>

If the browser is anything other than IE the second script should fire off, but if it's IE the first script should fire off. Although I see the alert statement fire but the rest of the script is being used from the second javascript.

The only issue is because,

fillOpacity: 0.1

I want it to be 0.1 in IE but 0.9 in other browsers.

Answer 1

Looks like you are still firing the base code after the IE code. If all you wish to change is the opacity then do this:

<script type="text/javascript">
opacity = 0.9;
</script>
<!--[if IE]>
<script type="text/javascript">
opacity =  0.1;
</script>
<![endif]-->

<script>
    $(document).ready(function () {
    $('#usa').mapster({
        fillOpacity: opacity,
        render_highlight: {
            fillColor: '2aff00',
            stroke: false,
            altImage: 'theImages/skillsets.png'
        },
        render_select: {
            fillColor: 'ff000c',
            stroke: false,
            altImage: 'theImages/skillsets.png'
        },
        fadeInterval: 50
    });
    });
    </script>