I have a navigation bar in my jgrid and I've added so many buttons that they are superimposing to each other. This way it's difficult to see which button is which.
I'd like to know how I can avoid this. Could I have two navigation bars? or a two-row bar? Maybe deleting the pager?
Thanks in advance
Natalia
I had the same problem as you and I solved it with jQuery adding more rows.
var pagerNav = $("#pagernav")
var gridnavTbody = $(pagerNav).find("tbody").first();
var navgridrows = $(pagerNav).find("td").first().siblings("td").addBack();
$(navgridrows).appendTo($(gridnavTbody));
$(navgridrows).wrap( "<tr><tr/>");
$(navgridrows).children().css("text-align","center");
$(navgridrows).attr("align","center");
$(navgridrows).children().css("float","none");
$(pagerNav).css("height","75px");
And this was the result:
Html before jQuery code
and this is after jQuery
Related
I have an element in my product list page that I want to hide until the rest of the document has finished loading. (it's a list item with the class "hideme")
The JS solution doesn't work for me, so I'm looking for a scriptaculous method, which should work better in Magento.
Any help would be greatly appreciated.
Thanks!
If you want to make something client-side once the DOM has been loaded, you should try with this:
document.observe("dom:loaded", function() {
// initially hide all containers for tab content
$$('div.tabcontent').invoke('hide');
});
Is more like jQuery(document).ready();
Greetings.
I am creating an SPA with KendoUI-Web and my layout for the login view has a sticky header and footer. To do this my divs that make up the view need to be direct children of the body.
I use the Following Code:
objLoginPage_Layout = new kendo.View('loginPage-layout');
objLoginPage_Layout.render($('body'));
However when I look in the Chrome Developer Tools I see that the layout is wrapped in a div. This div breaks my CSS.
How can I tell KendoUI not to wrap my layout in a div?
Regards,
Scott
Use KendoUI window.
I'm doing the same as you.
Here is their example http://demos.kendoui.com/web/window/index.html
If you need, I can share my code, it is real simple, but try yourself first.
try:
var theView = new kendo.View(template, { wrap: false });
http://docs.kendoui.com/api/framework/view#methods-render
Posted 3 hours ago (permalink)
Hi everyone,
I'm doing an ASP.NET MVC project with Kendo UI, and I've got a little problem.
I have a jquery script for re sizing my splitter.
window.onload = function () {
$("#vertical").css("height", $(window).height());
};
But when I load my layout, I've got the good size, but not the good display.
If I hide my bottom splitter , and then show it, it's the well display (2.png)
Thanks all for you answers :)
Did you try the following css #vertical{height:100%;} ?
I'm trying to fix the height of the 'main body of text' div and add a scrollbar so that everything stays on one page.
I'm a beginner with this and have tried to follow an array of different instructions on different websites but nothing has worked and would just like some very nice person to break it down for me!
you mus set the syle of the div in this way:
<div style="width:191px; height:190px; overflow:auto;" ..>text</div>
the attribute "overflow" set the scrollbal if the div contenent is to large.
I have created the layout for my new portfolio webpage here: http://vitaminjdesign.com/work.html
I want to have a legend with tags (ALL, logo design, marketing, web design, print design) and when these tags are clicked, the page filters the results and display them like they are currently displayed. At first, I want ALL projects displayed, but when the user clicks on a tag (say "print design"), the list is filtered and displayed.
If I have this as my legend: logo
and when logo is clicked, I want all of the div's with the class "logos" to stay and all of the the divs with the other classes to fade out.
What is the easiest way in jquery to make this work. Please note: I am not very experienced with jquery, so please be as thorough and idiot-proof as possible.
First add the classes (logodesign, marketing, webdesign, printdesign) that apply to each project to the div your are assigning the numeric class to.
Then create links that are to filter for each tag like:
Logo Design
Then assign a click event that will hide the others and show the selected one.
var $projects = $('#projects');
$('a.logodesign').click(function() {
hideAll();
showTag('logodesign');
});
function showTag(tag){
$projects.find('div.'+tag).stop(true).fadeIn();
}
function hideAll(){
$projects.find('div.logodesign, div.marketing, div.webdeisgn, div.preintdesign').fadeOut();
}
Although it isnt a direct answer to my question, I found a tutorial on how to achieve EXACTLY what I wanted. It is here:
http://www.newmediacampaigns.com/page/a-jquery-plugin-to-create-an-interactive-filterable-portfolio-like-ours#zip