JQuery :: Superfish Nav-bar Style Solution For WordPress ?
Jun 18, 2009I`m to make a working css solution to use nav-bar style jQuery Superfish menu for WordPress.
View 1 RepliesI`m to make a working css solution to use nav-bar style jQuery Superfish menu for WordPress.
View 1 RepliesI'm trying to create my first theme and I'm new to both PHP and jQuery. I have been trying to get Superfish working on Wordpress for too long now.I have placed a directory called "js" in my theme's folder. jQuery 1.4 is in there with the Superfish, HoverIntent, and CSS files. This is the code...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">[code]....
The only thing that shows up is a list of the Pages without any CSS or fancy menu happening.
Has anyone used the Superfish navbar menu sucessfully with WordPress 3.0 menu manager?I have got the regular Superfish menus to work with the new WordPress Menu system, but not the navbar menu.
View 1 Replies View RelatedI have used your great plugin for a menu in Wordpress 2.8.4 and I wanted to use the default Wordpress jQuery library jquery.js?ver=1.3.2 but your plugin Superfish wouldn't work. I added the jquery-1.2.6.min.js file and it did work OK. Since there is no reason to have calls to two jQuery libraries which are doing the same thing I wanted to only use the default Wordpress jQuery version. After some searching I found an answer at this site:[url]..
I changed this to: jQuery(document).ready(function($){ Notice the $ function being moved. This now works OK using the default Wordpress jQuery version 1.3.2. and I imagine with the latest version of jQuery.
I'm almost done customizing the Superfish jQuery menu to fit my web site theme. I have all of the menu hover and submenu hover styles in place, but I'm having a problem with the color of the top-level menu item's font when the submenu is expanded. The active top menu item's background matches the hover color, but when I hover overa submenu item, the font color reverts back to the original (non-hovered) color. How do I get the top level menu item's color to match its hover color when the submenu is expanded?
The relevant portions of my CSS are as follows:
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
color:#8C1C39;
}.sf-menu a.sfHover {
color:#FFFFFF;
}.sf-menu li {
background:transparent;
}.sf-menu li li {
background:#FFFFFF;
}.sf-menu li li li {
background:#9AAEDB;
}.sf-menu li:hover, .sf-menu li a:hover {
color: #FFFFFF;
background:#00207B;outline:0;
}.sf-menu a:focus, .sf-menu a:active,
.sf-menu li li a:hover, .sf-menu li.sfHover {
background:#8C1C39;
color: #FFFFFF;
outline:0;
}
Attachments
TopHover.jpg
Size : 10.86 KB
Download : 505
SubHover.jpg
Size : 9.33 KB
Download : 510
I have a problem with nav-bar style insuperfish when update jQuery from 1.2.6 to 1.5 or any later than 1.2.6. Submenu start with UL not begin left. roblem in IE8. Superfish download from: [URL] Replace source from [URL]
View 2 Replies View RelatedI was basically trying to follow several tutorials to get a superfish menu working on my website, but I don't seem to be able to get it to work.I included both the superfish.css and the superfish.js in my website's header; both paths are corrent and point to the designated file.I then included the superfish function in my header like this:
<script> $(document).ready(function(){ $('ul.sf-menu').superfish({
delay: 1000, // one second delay on mouseout
animation: {opacity:'show',height:'show'}, // fade-in and slide-down animation
[code]....
The corresponding <ul> element has the required sf-menu class, but still there are no animations, no fading, no delays, just the plain css functionality provided by the superfish.css.
My understanding had been that $.css("width") would return the original user selected style, eg "100%" or "10em", and $.width() returned the computed width, always in "px". Not so, following the code through for .css(), it calls something called getComputedStyle and the only difference between the two functions turns out to be a post-fix of "px" on the .css() result - not very useful. I need to know whether my user has called me with a proportional dimension, or a fixed one. How to tell with jQuery?
View 1 Replies View RelatedI'm trying to get isotope up and running on my Wordpress site.
Isotope works fine on its own: [URL]
But for some reason, which I can't quite fathom, it doesn't work in Wordpress: [URL]
This is probably quite a simple problem but I can't figure out the answer. I'm working on a site that has news stories and events coming in. What I would like is to have the news stories to be styled with squares and events with discs for instance. I might be able to change the actual plug-in so the CSS affects this change, but I just wondered how I could change the list-style-type with jQuery.
[Code]...
I'm doing the design update work for a previous site, and it's done except for one thing. I want a slideshow to be on the homepage, specifically the plugin Slider Pro. I have put in the shortcode and yet the plugin does not display. Also the navigational buttons do not animate with Jquery. Strangely if I test a Jquery code in the header displaying an alert it works. I have tried disabling all plugins except for the slider one to no avail. [URL]
View 10 Replies View RelatedI've bene working on this for a while and the Wordpress people think it's a jQuery issue.So... here goes:I have the following function in a file called sec_menu.js:
var speedIn = 300;
var speedOut = 300;
jQuery(document).ready(function() {
[code]....
Does anyone have experience using the form plugin 'jquery.form' insideWordpress and if so does this plugin have any special requirements?
Scenario I'm attempting to use jquery.form to handle a form that appears in a dialog. The arrangement works on static pages on the server, outside of WP but in the same domain.However, when the form is presented in the dialog on a WP page the submit function fails, usually resulting inthe dialog closing having not submittedthe form.
One question thatoccurred to me is how do jquery plugins respond if used withWordpress with regard to the use of "$"? Perhaps its not an issue but I wondered if it might be the cause of the problem here.
The triggering script is just the standard script with a few options added, again this works on static pages:
The php to process the form is:
Does anyone know how I could integrate this jquery plugin into wordpress?I'd like to use wordpress for posts etc and then set up two pages within wordpress to act as galleries (using this jquery gallery on each page). I'm sure it'd be possible, just need some tips on how to go about it.
View 1 Replies View Relatedhow to add a jquery plugin into wordpress. I've searched all over and can't find specific instructions...
View 1 Replies View RelatedI was wondering if someone can help me out here. I was wondering if its possible to get this Jquery Image Slider to fit a 250x250 Pixels I want to create a widget on Wordpress.[URL]..If possible in order to get this done we could move the control with the numbers on the bottom and keep the descriptions on top.
If this cant be done, do any of you know any 250x250 Jquery Image sliders. That can possibly work in this format? I'm trying to stay away from Flash much as possible.
I'm using a preview slider on my Wordpress site, but it doesn't work the way I want it to. As soon as the preview is changing it shows the next preview on the rightand the previous on the leftside of the center preview.
[Code]...
I updated my Wordpress installation today and it seems to have broken the plugin somehow; in Internet Explorer the images all display at once, stacked on top of each other. It's the same problem from this thread from last year:It was fixed at the time using 'fit', but apparently this no longer works.
Script:
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/cycle.js"></script>
[code]....
I've read up on using easing and animate but am having trouble implementing into my tabbed widget in my wordpress sidebar (still under construction so no link). The widget works as is but I would like to instate easing into it.
I'm unsure whether to put the script code into header.php or where exactly though. Nothing seems to work. Does anyone know of a tut or how to incorporate jquery functions into a wordpress sidebar widget perhaps?
I'm having an issue with PrettyPhoto not working in IE. It works great in all other browsers. In IE, it will start to open, show a really small box and then no content. Here is a link to the site that I'm working on:[URL]..
View 3 Replies View RelatedI use this library for almost all my slideshows, and have not had a problem up until now. I know the JS files being referenced are correct, the image paths are correct, so what seems to be the hiccup here? I am willing to bet its something simple.
http:[url]....how the three images just stack now, with the jquery cycle plug-in they are supposed to fade.
I downloaded it via the "Download" link from URL...I have a small form where a German date (i.e. 1.1.2011 or 01.01.2011) should be inserted by a user.So looked up the API on URL...for the needed method and there it was documented: dateDE.However it did not work, my form would submit if anything was inserted into the input field.So I did some Google searches and some searches here, and couldn't find anything.Searching through the additional-methods.js, I still couldn't find the method.Looking at the jquery.validate.js I noticed there was no dateDE defined, just "date" and "dateISO"I'm not sure if this is already known, or intentional - but it seems to me that the dateDE method REALLY IS missing.However I fixed it for me and want to share (not sure if "share-worthy" but I'll do it anyway)[code]
View 2 Replies View RelatedI am putting the finishing touches to a custom written (pHp) article editor to allow users to publish content on a website.I have basically finished the project, and I am putting the finishing touches in with jquery widgets, such as a word counter. I would also like people to be able to highlight a section of text, then have some custom tags wrap the text (much like on this forum when you highlight a word in the message box and hit the wrap button).I would like my own custom tags to be used, such as <span class='someclass'>some entered text</span> rather than predefined ones.
View 9 Replies View RelatedIm using a plugin already called pbd-ajax-load-posts which is found here: [URL] (it's free and only has 3 files, a php, a css and the js which is where everything is at) The plugin works, but not on my template which is: [URL] It's a simple plugin and I tried playing around with it, and got really close to what I'm trying toachieve which is load the posts to an element,it's just not loading to where it needs to be. I'm new to this jquery/javascript and been trying to study it more
[Code]...
I'm trying to add a slideToggle to a paragraph in a Wordpress blog page. The following code works for triggering an alert, but when I replace the alert with the slideToggle, nothing happens.Here's the alert:
jQuery.noConflict();
jQuery(document).ready(function() {
jQuery("#principles").mouseover(function() {
[code]....
Taken right off a jQuery API page, inserting my own id names .The "#principles" is the id of a span of text just above a paragraph with an id of "p=principles".
I am customizing my WordPress adminpanel, and ive run into a problem. I want to use jQuery to replace a value of an input, and I've got that part working. The thing is that it gets added again (via ajax or jquery, I don't know. its some kind of in-page reloader) and my script fails to replace the value the second time..
jQuery(document).ready(function($) {
$('input#custom-menu-item-url').attr('value', ' ');
});
That's the code I have right now. For those of you who can check a WordPress installation, its the nav-menus.php in the admin panel, custom links. So how do I get this to replace the value even if it the value gets added after page load?