jQuery ui对话框模态删除图像周围的虚线边框

时间:2016-01-01 04:55:23

标签: jquery user-interface dialog

我有一个对话框弹出窗口,我无法获取链接图像周围的边框消失。

http://www.littlecurryshop.com/home-test-2-1

我无法将ui css文件更改为方形空间,我只需将其链接到文档的头部。

我可以添加自定义css,但我不能让这个边框消失!

由于有很多摆弄,代码很草率,但现在是:

HTML                                                                   

            Biju的小咖喱店

现在有一家网上商店           


                   

    <p>
      <br />
      <a href="/store" class="link">Check out the selection now</a>
    </p>
    </div>

CSS

//Popup
.ui-dialog-titlebar {display:none !important;}
.ui-widget-overlay {background: #000 !important; opacity: .6 !important;}
.no-close .ui-dialog-titlebar-close {
  display: none;
}
.ui-widget-content .image {text-decoration:none !important;border-width:   0px !important;}
#popUp {
  overflow: auto;
  padding: 20px 30px;
  border: solid 4px rgba(255,255,255,.8);
  text-align: center;
  border-radius: 20px;
  background-color: rgba(227,177,59,.8) !important;
}
#popUp img {width: 14%;}
#popUp h1 {
  font-size: 1.6rem;
  font-weight: 500;
  margin: 10px 0 20px 0;
}
#popUp h1 span:first-child {
  background-color: #375b89;
  color: #e2b23c;
  padding: 4px 10px;
}
#popUp h1 span:last-child {
  font-size: 1.2rem;
  color: #333;
}
#popUp a {border-width:0 !important;text-decoration: none;}
#popUp .image img {background-color: #fff; border: solid 6px  #c1282d;border-radius: 100%; padding: 20px 20px 30px;width: 30%;height:   auto;}
#popUp .link{
  font-size: 18px;
  color: #375b89;
  border: solid 2px #375b89 !important;
  padding: 8px 20px;
  animation: unonline forwards 1s;
  -webkit-animation: uonline forwards 1s;
}
#popUp .link:hover {
  animation: online forwards 1s;
  -webkit-animation: online forwards 1s;
}
@keyframes online {
  from {background-color: transparent;}
  to {background-color: #375b89;color: #fff;}
}
@keyframes unonline {
  from {background-color: #375b89}
  to {background-color: transparent; color: #c1282d}
}
#popUp .close {float:right;}
#popUp i {font-size: 28px;}
#popUp h2 {color: orange;}

的jQuery

$(document).ready(function(){
var wW = $(window).width();
var w = wW * .9;

  $('#popUp').dialog({
    modal: true,
    autoOpen: false, 
    dialogClass: "no-close",
    width: w,
    height: "auto",
    show: {effect: 'fade', duration: 800},
    hide: {effect: 'fade', duration: 500}
 });
  setTimeout(openPopup, 2500);
  function openPopup(){
    $('#popUp').dialog('open');
    $('#header').hide();
  }
});

$('.close').click(function(){
  $('#popUp').dialog('close');
  $('#header').show();
});

1 个答案:

答案 0 :(得分:0)

我认为图像正在产生虚线的边界。尝试在脚本中添加此行。

$('#yui_3_17_2_1_1451624877239_290').css('outline','none');

希望它有所帮助。