Solved

Can't seem to get rid of the text decoration around the thumbnails

Posted on 2012-03-15
4
240 Views
Last Modified: 2013-11-19
Hello:

I can't seem to get rid of the text-decoration around the thumbnails:

http://inetwebdesign.com/jQueryTools/banners/thumbnail_pager_method8.html

 I have tried several methods via css but to no avail.

Thanks in advance as always for your help.

Regards,
seeker
0
Comment
Question by:seeker7806
  • 3
4 Comments
 

Author Comment

by:seeker7806
ID: 37726152
Forgot. The problem exists only on IE. Everything is good on Firefox and Chrome
0
 
LVL 10

Accepted Solution

by:
c_a_n_o_n earned 500 total points
ID: 37726201
0
 

Author Comment

by:seeker7806
ID: 37726797
Hi c_a_n_o_n:

Thanks for your response.

I changed and added z-indexes (z-indices?) but this did not change the situation:

http://inetwebdesign.com/jQueryTools/banners/thumbnail_pager_method8.html

Here is the css:
/*pager*/


.bx-pager {
	background-image:url('gradient-background.png');
	position:absolute;
	margin-top:-85px;
	margin-top:-87px\9;/*IE8 and older*/
	margin-left:0px;
	margin-left:15px\9;/*IE8 and older*/	
	height:40px;
	width:530px;
	z-index:100;
	
}



.bx-pager a img{
	height:25px;
	width:40px;
	text-decoration:none;
	display:inline-block;
	outline:none;
	margin:0;
	padding:0;
   
		
}


.bx-pager a {
	height:25px;
	width:40px;
	text-decoration:none;
	display:inline-block;
	z-index:112;
	
}

.bx-pager .pager-active,
.bx-pager a:hover {
	height:25px;
	width:40px;
	text-decoration:none;
	display:inline-block;
	padding:0;
	margin:0;
	border:2px solid white;
	z-index:113;
	
}

Open in new window


I am thinking this has to do with the javascript:

  var f = "";
            if (b.buildPager) {
                for (var i = 0; i < e; i++) {
                    f += b.buildPager(i, g.eq(i * b.moveSlideQty))
                }
            } else if (c == "full") {
                for (var i = 1; i <= e; i++) {
                    f += '<a href="" class="pager-link pager-' + i + '">' + i + "</a>"
                }
            } else if (c == "short") {
                f = '<span class="bx-pager-current">' + (b.startingSlide + 1) + "</span> " + b.pagerShortSeparator + ' <span class="bx-pager-total">' + g.length + "</span>"
            }
            if (b.pagerSelector) {
                a(b.pagerSelector).append(f);
                n = a(b.pagerSelector)
            } else {
                var j = a('<div class="bx-pager"></div>');
                j.append(f);
                if (b.pagerLocation == "top") {
                    h.prepend(j)
                } else if (b.pagerLocation == "bottom") {
                    h.append(j)
                }
                n = a(".bx-pager", h)
            }
            n.children().click(function () {
                if (b.pagerType == "full") {
                    var a = n.children().index(this);
                    if (b.moveSlideQty > 1) {
                        a *= b.moveSlideQty
                    }
                    d.goToSlide(a)
                }
                return false
            })
        }
        function R(c, e, f, g) {
            var i = a('<a href="" class="bx-next"></a>');
            var j = a('<a href="" class="bx-prev"></a>');
            if (c == "text") {
                i.html(e)
            } else {
                i.html('<img src="' + e + '" />')
            }
            if (f == "text") {
                j.html(g)
            } else {
                j.html('<img src="' + g + '" />')
            }
            if (b.prevSelector) {
                a(b.prevSelector).append(j)
            } else {
                h.append(j)
            }
            if (b.nextSelector) {
                a(b.nextSelector).append(i)
            } else {
                h.append(i)
            }
            i.click(function () {
                d.goToNextSlide();
                return false
            });
            j.click(function () {
                d.goToPreviousSlide();
                return false
            })
        }
        function Q(c) {
            if (b.pagerType == "full" && b.pager) {
                a("a", n).removeClass(b.pagerActiveClass);
                a("a", n).eq(c).addClass(b.pagerActiveClass)
            } else if (b.pagerType == "short" && b.pager) {
                a(".bx-pager-current", n).html(x + 1)
            }
        }
        function P() {
            g.not(":eq(" + x + ")").fadeTo(b.speed, 0).css("z-Index", 98);
            g.eq(x).css("zIndex", 99).fadeTo(b.speed, 1, function () {
                E = false;
                if (jQuery.browser.msie) {
                    g.eq(x).get(0).style.removeAttribute("filter")
                }
                b.onAfterSlide(x, g.length, g.eq(x))
            })
        }
        function O() {
            e.hover(function () {
                if (t) {
                    d.stopTicker(false)
                }
            }, function () {
                if (t) {
                    d.startTicker(false)
                }
            })
        }
        function N() {
            h.find(".bx-window").hover(function () {
                if (t) {
                    d.stopShow(false)
                }
            }, function () {
                if (t) {
                    d.startShow(false)
                }
            })
        }

Open in new window


but I am not certain.

Regards,
seeker
0
 

Author Comment

by:seeker7806
ID: 37727076
Hello:

I found the solutions here:

http://www.htmlforums.com/css/t-resolved-text-decoration-none-not-working-in-ie-144809.html

This worked:
.bx-pager a img{
	height:25px;
	width:40px;
	text-decoration:none;
	display:inline-block;
	outline:none;
	margin:0;
	padding:0;
	border:none;
   
		
}  

border:none;

Open in new window


Regards,
seeker
0

Featured Post

Space-Age Communications Transitions to DevOps

ViaSat, a global provider of satellite and wireless communications, securely connects businesses, governments, and organizations to the Internet. Learn how ViaSat’s Network Solutions Engineer, drove the transition from a traditional network support to a DevOps-centric model.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Adding a countdown to HTA 12 92
ASP.net Markup for Sub Menu 2 39
Text color in a select 11 20
Top Aligning Inner Divs 5 21
Get to know the ins and outs of building a web-based ERP system for your enterprise. Development timeline, technology, and costs outlined.
Developer portfolios can be a bit of an enigma—how do you present yourself to employers without burying them in lines of code?  A modern portfolio is more than just work samples, it’s also a statement of how you work.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question