i'm trying to create a tree menu, each time i click into a category it shows me the subcategories.My code works fine but i have some spaces between a category and his subcategories, it's not a css problem
[Code]...
i want to list car category name and car details in a single page but the result is car details are same for every category.
[Code]...
I'm trying to set an option of a drop-down as active, regarding the category. I added the category name for this to the body class="category-XXXX-XXXX". What I need is something like an array to say:
if == category-AAAA-AAAA then option value=1 is selected
if == category-BBBB-BBBB then option value=2 is selected
if == category-CCCC-CCCC then option value=3 is selected
and so on. Unfortunately, I'm getting totally confused where to actually start and how to do that. I know, it is for sure out a line to ask for a finished script, but I'm sure someone can give me a hint, on how to do that.
My goal right now is to make a two-part navigation bar where you don't have to reload the whole site, when you click on a link. The navigation bar consists of two <ul> lists with <li> float:left and <a> display:block, so I basically have two lines. It's probably easier to understand if you see it for yourself: jsfiddle (had to change the css style, because I use .less but it works)
When you load the page it's just like that, you have your main category (A,B,C,D,...) and the sub-category (A1,A2,A3,...). What I want: If you click on B, the sub category changes to B1,B2,.... If you click on a sub category the site loads the requested page (with ajax = best solution?!)
My thoughts
At first I thought about just changing the name and href attribute of the second list, but the main categories have different amounts of sub categories, so I would need to add or remove <li>'s. Then I thought about using .load() but I somehow screwed up (of course) and the loaded <ul> doesn't have any css style (wrong order?) and I can't see anything. (with a loaded test.html site containing only the word "test" it worked) Is ajax "overkill" as a solution?
CodeIgniter and the URL
I use CodeIgniter (a PHP framework) for the website and URLs like this: www.example.com/maincategory/subcategory (e.g. example.com/A/A3) That's no problem at all, if I don't use any javascript and reload the whole site every time. But is it possible to change the URL with jQuery when the user clicks through the navigation bar? You click on B, the URL changes to example.com/B all the subcategories change to B1,B2,...When you click on B2 the URL changes to example.com/B/B2 and the site loads the requested page (I guess with ajax, so the navigation stays the same?!)
Minor problem: when you load the site, click on B, then B3 for example, you would get the url example.com/B/B3. If you now save this link, close the site and reopen it with the link, CodeIgniter would load the right site and everything, but the navigation would show A1,A2,.. in the sub category.
Hover vs click
Almost every page where I saw this kind of menu they used hover to change the sub category. But I thought click would be better, so you don't have to avoid touching B,C,D,.. if you want to go from A to A9 for example. Only downside is that you have to click before you see the sub categories.
Summary
A two part navigation menu you can use without reloading, changing URLs (when possible) and probably ajax to load the actual content.
I was hoping if someone could do this for me, basically I'd like to have a parentcategory. For example this one:''Remixes''
And when you click on it a couple subcategories slide down from under it. Like this
[Code]...
I have been working on this navigation for something to do, and I cannot for the life of me figure out how to get the parent category. Here is an example of my navigation:
[Code]....
So it will produce a sub-menu with other jQuery that I worked out. So, what I am trying to figure out is when you click on "Project 003" I want JavaScript (or jQuery) to find what menu-item it belongs to, so in this case "#mi". I know I have to go 2 parents up (li, li), but I can't figure out how to get back down into the anchor to use the .attrib('href') function.
how one could create a category picker just like gumtree (preferably in jquery):Specifically the points How clicking on a category opens another to the right How clicking on a category appends a variable like "#cat-10201" into the url (and vice versa) How css lists are used instead of form select menus (making it easily styled) How clicking on a deep subcategory automatically preselects all parent categoriesI'm not looking for anyone to actually code it for me (that would be outrageous :p) but tips on how it's actually structured and steps on how it can be coded I can do PHP and I know CSS also
View 1 Replies View RelatedI have a multidimensional associative array in JS which contains category information for a navigation. It's actually set up through PHP, which pulls the info from a database then translates it into JS. I know it's set up correctly since I can see it in the source once the page is rendered. However, accessing this array causes external JS code (from my Slimbox files) to be displayed in the nav. It's as if the array is set up right, but accessing the elements brings in Slimbox code as the elements. It's very strange. You can see the effect here.
It's the secondary nav under Home, Featured Items, etc. Each token that is clickable is separated by an asterisk: [URL]. Notice the other page's navs work great! Try the jewelry nav on the Home page and the categories are set up fine. This is because other pages do not link to Slimbox. (And no, the site aint pretty because I wanted to get the hard stuff working before I work on the look). I've heard of jQuery interfering with Slimbox and Lightbox, but my nav is not using jQuery!
I'm looking for a script or applet that will allow users to search by zipcode or selected category for results. I would like something already built so I can just customize it to our needs. I'm sure it will need to have a database setup for it to work which I am fine with doing. I can modify scripts and files but I have no idea where to start with this from scratch.
We also use the same data for our "Layar" app for the iphone and driod phones. Has anyone messed with layar scripting and databases? We are using hoopala now which makes data entry simple but we cannot modify their database to add category options. It would be nice to find an alternative to hoopala so we could use one database for both the layar app and the zipcode/category search on our site.
When updating our agency's webpage daily, [URL] I am looking for a shortcut to save time.. When I update air quality numbers. I have to put the conditions. Ex.. 50 = good 100= moderate etc etc. As you see here(bold and underlined)
[Code]...
Well instead of having to type good or moderate every-time to correlate with the numbers, I want to find a way the category can automatically default correctly when I put in just the number. Ex, if I put in the number 100, it automatically knows to issue/ put Moderate with out me having to type it. I semi wrote a code .. Yet can't seem to know how to execute. Seeing if Maybe I can get some assistance.
[Code]...
I using JQuery to call back asp.net web service, The web service is simple, only query from SQL Server and return result as JSON. everythings is cool. Only problem is the key of dictionary after Deserialization by eval() method,It cannot access. For example:
[Code]....
as a little side-project, I want to make a search engine that behaves similar to the "Just Type"-Feature of Palm webOS: When the user presses a key somewhere on my site, a box scrolls in containing the typed letters and the search results. In order to realize that, I bound a "keydown" event to $(document). I have but one problem: the "space" key. It is correctly recognized, the space is concatenated to the search term; but then, the site scrolls down (found out it's the default action when pressing space in the browser). How can I stop this pagescroll (and maybe other standard-actions) from happening, i.e. my event should recognize the keydown, but not the browser? I tried event.stopPropagation() and event.stopImmediatePropagation(), but somehow it doesn't work. Event when I add "keyup" and "keypress" to the mix (code below).
[Code]...
I'm working on this site [URL] and suddenly there is a blank space to the right of the site. As far as CSS is concerned it is not there. I am posting here because I was experimenting with jQuery at the time (I know almost nothing about it). However, I have removed all the jquery code from my files and it has made no difference. IE is giving me a 'console' undefined error.
View 3 Replies View RelatedWhen addClass('choose') to li, there is always a white space right under it.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URl]">
<html xmlns="[URL]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript" src="demo_inc/jQuery.js"></script> .....
When I fade something out the items below it jump up, then jump down again whenI fade it back in. Is there a way to maintain the space so the items below don't move?
View 1 Replies View RelatedI just wonder if this is even possible, I'm not a jquery programmer by any means, but I hope I can use it for the purpose of my project. I know wordpress includes jquery automatically, so I wanted to see if I can take advantage of it
View 3 Replies View RelatedI'm using $("form").serialize(), and then doing an AJAX request.JQuery automatically replaces spaces with the + character.(I couple replace the + character with a space on the server side, butI want the users to be able to enter the + character when they submit
forms.)
I have created a simple portfolio item for a site I am working on, with left and right buttons to move between the visible thumbnails in the portfolio.
The problem is this: when I click on one of the left or right buttons used to scroll the active list items, it resizes the space between all of the thumbnails by 1 pixel per click, up to 10 clicks.
Here is the markup and my javascript:
Warning: Complete newbie! I am trying to installthis simple slideshow as a header on my site. It is working fine, but there is an incredibly large gap after the header (see photo below) that is not supposed to be there. Here is the code I am using:
<script language="javascript" type="text/javascript" src="http://www.logfinish.com/logfindesign/pop-up.js"></script> <table width="1004" border="0" align="center" cellpadding="0" cellspacing="0">
tr>
<td align="left" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<style>
[Code]...
I have been trying out image replacement on radio buttons and check boxes for styling forms. In this case I might have something like:
<label for="usd" class="currency">USD</label>
And using addClass
$(this).addClass('hover');
It turns into
<label for="usd" class="currency hover">USD</label>
The problem is that in IE6 if you were to have two custom radio button classes on the same page then the first one takes on the styling of the last one because IE6 can't figure out the chained class. Ideally I would want the class to be amended on hover toclass="currencyhover" instead so I could write a unique CSS class like .currencyhover instead of .currency.hoverIs there some way to use addClass and not have it add a space between the already existing class and the new one? If not, is there some way to trim it
I have an accordion in which all the data is being populated from a database. The problem is that after it runs through the query and adds my data it leaves alot of extra spaces which leads the user to have to scroll a great deal before finding the next header.
Here is my code.
<?
$sqlQuery = "SELECT id, date, name FROM webinars ";
$result = mysql_query($sqlQuery);
?>
[Code].....
I'm currently using the Jquery Flipv plugin, which works well. The only problem is, some words have extra padding at the end, depending on how many characters.
I'm not sure why this is, but it seems that the conversion to vertical text creates some extra spacing on certain browsers.
I have a div ( id="rightheader") and inside there is a table. The following code replace all content of the table with empty space and then remove the table header.
[Code].....
but that just doesn't produce anything.
I have a JSP page that I am updating via an AJAX post. When the page gets sufficiently large, I get a "script stack space quota is exhausted" message. I realize it is due to the size of the response, but is there a better way than the following?
jQuery.fn.success = function(responseText, statusText, $form) {
var formId = '#' + $form.attr('id');
$(formId).replaceWith($(formId, responseText));
// Set up our form object again now that we've replaced our form with the data coming back.
$form = $(formId);
// ...
};
I have an input box with a 'did you mean' box that pops up under it, and it pulls it's results from another php page, however when a term with a space in it, such as "I am" vs. "Im" is entered, it stops working. This is the code I'm using to pull the results. So I made a added a simple string replace to change each space into '+';
search = $('#search').val().replace(' ','+');
search.keyup(function() {
results.load('results.php?q=' + search);
});
But for some reason it is only changing the first space into a '+'; so for example: "Hello how are you" = "Hello+how are you". But I need it to change to "Hello+how+are+you";
I wonder how to create the effect of objects being aware to other objectsthis is a good example:[URL].. I'm searching for some resources and good tutorials
View 1 Replies View Related