Marco Rizzo Posted October 23, 2018 Share Posted October 23, 2018 Hi, I would like to change the icons in theAccordion Menu. Actually the JS usejQueryUI icons. I use this javascript (*) to create Accordion Menu and I would like change the icons: ui-icon-triangle-1-s ui-icon-triangle-1-e with icons that I insert into HTML as (embedded in analysis). The HTML is (**) How can modify the code for insert them Thanks so much for the help and possible solutions! Regards, M. (*) doStartup = function () { // Configure accordion $("#" + jsAccord).accordion({ collapsible: true, active: 0, heightStyle: "content", beforeActivate: function (event, ui) { // The accordion believes a panel is being opened if (ui.newHeader[0]) { var currHeader = ui.newHeader; var currContent = currHeader.next('.ui-accordion-content'); // The accordion believes a panel is being closed } else { var currHeader = ui.oldHeader; var currContent = currHeader.next('.ui-accordion-content'); } // Since we've changed the default behavior, this detects the actual status var isPanelSelected = currHeader.attr('aria-selected') == 'true'; // Toggle the panel's header currHeader.toggleClass('ui-corner-all', isPanelSelected).toggleClass('accordion-header-active ui-state-active ui-corner-top', !isPanelSelected).attr('aria-selected', ((!isPanelSelected).toString())); // Toggle the panel's icon currHeader.children('.ui-icon').toggleClass('ui-icon-triangle-1-e', isPanelSelected).toggleClass('ui-icon-triangle-1-s', !isPanelSelected); // Toggle the panel's content currContent.toggleClass('accordion-content-active', !isPanelSelected) if (isPanelSelected) { currContent.slideUp(); } else { currContent.slideDown(); } // Set current date type toggleDateType($('#periodSelector select')[0].value); return false; // Cancel the default action } }); // Change accordion colour $("#accordion .ui-accordion-header").css("background", "#7a7a7a"); $("#accordion .ui-accordion-header").css("border-color", "#7a7a7a"); $("#accordion .ui-accordion-header").css("border-bottom-right-radius", "30px"); $("#accordion .ui-accordion-content").css("background", "transparent"); }; // Startup $("document").ready(function () { doStartup(); }); (**) Link to comment Share on other sites More sharing options...
Sayali Patil Posted February 14, 2019 Share Posted February 14, 2019 Hello, When you say I am assuming you are referring to the Text area image insert option which will insert a tag something like - You can extract the src of this image and use it ,if that is what you are looking for using this js- Add an id attribute to the image var myimg=$("#img1").attr("src"); var ind=myimg.indexOf("&image"); if (ind > 0) { var temp = myimg.substring(ind+7,myimg.length); alert(temp); } Now the name of the image is available in temp and you can use it further in your code. It would be great if you could share a sample dxp demonstrating this usecase so we could help out. Thx! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now