user1360434
user1360434

Reputation:

how to make link text “close” instead of cross icon appear in jQuery dialog?

In a run-of-the-mill jQuery dialog, you see a cross icon in the top right-hand corner. When you click it, the dialog window closes. The underlying HTML looks as follows:

    <a class="ui-dialog-titlebar-close ui-corner-all" href="#" role="button">
      <span class="ui-icon ui-icon-closethick">close</span>
    </a>

In lieu of the cross icon, I want the “close” text link to be visible. Can this be done?

Upvotes: 1

Views: 751

Answers (1)

Emmett
Emmett

Reputation: 14327

You can achieve that and modify it however else you'd like with CSS:

.ui-icon-closethick {
    background-image: none;
    text-indent: 0;
    width: 50px;
}

.ui-dialog-titlebar-close {
    right: 1.3em
}

Upvotes: 1

Related Questions