Opened 8 years ago

Closed 8 years ago

Last modified 8 years ago

#7834 closed enhancement (notabug)

Instead of using images for icons we should have alternative option of html symbols

Reported by: rahuljain1248 Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.tabs Version: 1.8.16
Keywords: Cc:
Blocked by: Blocking:

Description

Hi, Just check tab close button it does not work if image not loaded. We can use symbol x for close button for reference just check this example you can check https://sites.google.com/site/indianraildaytoday/indian-railway/rail-activity similarly for arrows we can use symbols

Change History (2)

comment:1 Changed 8 years ago by Scott González

Resolution: invalid
Status: newclosed

I don't know what you're referring to, the tabs widget doesn't have close buttons and I have no idea what I'm supposed to be looking at on the page you linked to, it doesn't even include jQuery.

comment:2 Changed 8 years ago by rahuljain1248

Hi,

Sorry for vague explanation. I am just sharing piece of code where I am using close functionality with out using image but that's temporary arrangements. I am concern about loose coupling with images so that if not available we can fulfill requirement with symbols. I dont know if here we can attach images also for better explanation

<code><style>

span.tab-close-class {

position: relative; top: -7px; right: -9px; font-size: 8px; margin: 0px; paddin: 0px; border-bottom: 1px solid black;

}

span.tab-close-class:hover {

position: relative; top: -7px; right: -9px; font-size: 10px; font-weight: bold; margin: 0px; paddin: 0px; color: red; curser: hand; border-bottom: 1px solid black;

}

</style> <script>

$(document).ready(function() {

$( "#tabsCoachType, #coachesTab").tabs({collapsible: true});

$( "#coachesTab" ).bind( "tabsselect", function(event, ui) {

var closeOption = $('.tab-close-class:hover').length; alert(closeOption); var coachesObjArray = $("#coachesTab li"); if(closeOption==1) {

var totalLayer = $("#coachPrint p"); var a = $(totalLayer[ui.index-1]).html()[1]; a = parseInt(a); a = a--; $(totalLayer[ui.index-1]).remove();

alert($($logFact).html()); $(coachesObjArray[ui.index]).hide("2000");

}

});

</script> <div id="coachesTab">

<ul>

<li><a href="#loco-desc" ><span>Loco</span><span class='tab-close-class'>X</span></p></a></li> <li style="display: none;"><a href="#loco-desc" ><span></span></a></li> <li style="display: none;"><a href="#loco-desc" ><span></span></a></li> <li style="display: none;"><a href="#loco-desc" ><span></span></a></li>

</ul> </div>

Note: See TracTickets for help on using tickets.