Solved

JQery color picker issues

Posted on 2013-11-26
13
746 Views
Last Modified: 2013-11-26
Hi guys,

So I have the colour picker working on my personal website...

http://www.deans-place.co.uk/colourpicker/

When I try to upload it onto my work system it will not work? The letter 'c' in this link is where it should sit. Its like a management system so I uploaded various files into various locations and obv there is the template code around it, but I cant figure out what is stopping it from working....

http://test.urban-outdoors.co.uk/shop/test.html

Cheers,
Dean
0
Comment
Question by:deanlee17
  • 7
  • 6
13 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39677819
Your colpick.js and the tabs js file are being redirected to /
So you probably have an error in your htaccess
0
 

Author Comment

by:deanlee17
ID: 39677910
tabs js file?

Sorry, how did you check for the above?

Thanks.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39677918
HttpFox for FF

<script src="js/jquery.tabSlideOut.v1.3.js"></script>
0
 

Author Comment

by:deanlee17
ID: 39677934
Ah this page isnt using that file.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39677966
Maybe so but it just points to a common problem - both js files reside in the same folder (/js) and both are being redirected to the root folder - ergo no such file exist there.
0
 

Author Comment

by:deanlee17
ID: 39678055
Ye good point. I have updated those. No change.
0
What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 39678135
Bit weird, cannot see why its not initialising the plugin - I can do it manually in the page and get it to work.
Can you move the colpick script tag and the initialization script to just before the closing BODY tag - maybe there is a timing issue.
0
 

Author Comment

by:deanlee17
ID: 39678157
Just off home form work, will be looking at it this evening so I shall give that a try and report back.

Cheers.
0
 

Author Comment

by:deanlee17
ID: 39678172
Im assuming you are referring to the below:

$(function(){
  $('.color-box').colpick({
	colorScheme:'dark',
	layout:'rgbhex',
	color:'ff8800',
	onSubmit:function(hsb,hex,rgb,el) {
		$(el).css('background-color', '#'+hex);
		$(el).colpickHide();
	}
})
.css('background-color', '#ff8800');
});

Open in new window


<script src="http://www.ishop.co.uk/roots/1200/js/colpick.js" type="text/javascript"></script>

Open in new window


That are currently sitting in the header?
0
 
LVL 58

Expert Comment

by:Gary
ID: 39678263
Yep, move them to before the closing body (with the script tag first)
0
 

Author Comment

by:deanlee17
ID: 39678965
That was a great idea, as you can now see, its almost perfect.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39679011
Looks good to me, what is it that is not perfect.
0
 

Author Comment

by:deanlee17
ID: 39679149
Oh nothing, I just to reduce the length of the div, which I did.

Cheers for the help!
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now