I'm looking for a jQuery plugin or pair of plugins that will apply both a rounded corner and a drop shadow to a DIV box without the use of corner/border images. I've actually found quite a few that do one or the other but they seem to be pretty outdated, not in itself a problem but mostly for lack of support. So far, the few that I've found will do rounded corners and a few will do drop shadows. Sometimes they fail to work with each other and sometimes they only work in FF or Safari and fail in IE. I'm coming up short on the magic combination.
This failure in IE kinda defeats the whole purpose of doing this with jQuery since I can already get FF and Safari do to both with only CSS3. Does anyone know of a great jQuery plugin or pair of plugins known to work in all browsers including the latest couple/few versions of IE?
I am using the curvycorners.src.js script in order to achieve rounded corners in IE. If you go here: [URL] and then drag and resize your browser screen, you will see that the header and bottom section move out of alignment. When I remove the Curvy Corners script, the issue goes away. For some reason though it is only affecting the home-page of the site (not the sub-pages).
I am using Malsup's Rounded Corners plugin, which is amazing! I use Chrome and Firefox so it looks great. However mycolleague using IE, complained that the corners aren't round. So I looked and the corners are but the border is not (using the "keep" setting).
I saw that on ff/chrome you are using the border-radius which isn't supported by IE<9. Is there some other way to get the borders looking round on IE7,8 or do I just have to turn off the borders?
I am no expert in javascript. In fact I tend to use just open source when i use it at all but I believe there is a javacript script fro creating rounded corners for boxes? my question is: will this size to the size of someones monitor or viewport?The one i have found is as below. Can anyone tell me whether this script would. If not are there any orthers that do out there?
HTML Code:
function NiftyCheck() { if(!document.getElementById || !document.createElement) { return false;
I know CSS3 is at the stage now where we can use this feature comfortably across all modern browsers, but what else can be done via Javascript/Jquery to create our ever-so beautiful rounded corners ? Im trying to achieve a fairly consistent look "cosmetically" in all my sites going back as far as IE 7...For example my second site Ive built PAT Tester providing PAT Testing in Birmingham Worcester Bromsgrove Redditch Dudley Worcestershire West Midlands utilises CSS3 and looks ok in the modern browsers, but go back to IE8 and "yuck" its all squared out maaaan....!
Let me know where I can find a demo or example of JQuery Plugin which let's to create a Div with shadows(Inner and Drop shadows) and plugin to add gradient to Div background color?
I'm using the goMap Google Maps plugin very successfully (and I highly recommend it) - except that I can't seem to set shadows on my map markers. There appears to be support for this in the plugin source code - but there's no documentation I can find.
Anyone got an clues on how to do this? This is a simplified version of the code I'm trying to use. I have checked the obvious/stupid things - file path is correct (the image isn't 404ing in firebug), and there's no js errors being thrown, or any other warnings reported.
I'm trying to animate a rounded border of a div. In this post someone posted an solution which works in Chrome and Safari (didn't test it yet in IE), but for sure doesn't work in FF:
I'm trying to get borders to display properly with this plugin:On the page it says to use the keep option, but it does not give an option to specify what colour the border should be , if I specify the type of border in a stylesheet: like (border:1px solid #d4d4d4;) it shows the border great in firefox, but in ie6 and 8 it shows the border but not to the contours of the rounded box (ie square)
I have the following to add curvy corners to my divs; <script type="text/javascript"> $(document).ready(function(){ $('#album').corner(); }); </script>
My divs look like: <div id ="album" > ... something here ... </div > <div id ="album" > ... somthing here ... </div > <div id ="album" > ... somthing here ... </div > <div id ="album" > ... somthing here ... </div > The curvy corners only works on the first div. How to make it work on all album divs ?
I am playing with malsup's corners and I am getting strange nudges on both top corners in Opera, IE6 and Konquerer when applied to nested elements (to achieve a cornered border). I am using exactly the same code as on the demo page: "$(this).corner("round 8px").parent().css ('padding', '4px').corner("round 10px")". Strangely this only appears when the radius is more than 10px and div.outer's padding is less than 3px. All corners are rounded, just at the top div.outer still seems to have little develish horns.
this jQuery plugin nearly works in IE6. You can see the error that is produced at the bottom of the article corner. (I'm tackling the other issues... .png later) http:[url].....
This is a Google Maps API V3 issue - but I'm posting it here, as I'm getting no help at the Google-forum and I expect a Javascript solution.
The puzzle: I have defined a LatLng, like so: Code: var myLatLng = new google.maps.LatLng(61.4907009, 8.3708479); For some reason, if I alert(myLatLng), I get this:
rounding the quote up to two decimal places. I've seen a lot of codes and tried a bunch (math.round, tofixed, toprecision) but not exactly sure how to use them and where to put them. Calculator can be viewed here along with the code [URL]
I am developing a site that requires the navigation menu to have one rounded corner at the end on the home button. The default button state is created using a background image but I need it to also have a rollover effect on hover and also on focus (for the home page item only). I have tried to use CSS and curvy corners Javascript code to create the effect as I don't want to use images. However, I don't think the curvy corners script is picking up the div item that I want to apply the corner to.
The trouble is I have a number of div boxes on the site that also have rounded corners (3 rounded and 1 square). The CSS is working fine for these in all browsers apart from Opera but when it comes to the navigation it doesn't work properly in IE. Here's the HTML for the menu:
The CSS is in an external stylesheet, although I have also added the CSS for the rounded corner items to the header code.The class 'homefocus' seems to work when applied to the a tag on the home page but the other class 'home' which should work on hover won't work in IE.
I haven't found in my CSS book how to create a gradient to fill a division tag, and to create a border with round corners.
Is it possible using either CSS or JavaScript? I'd like to create a menu bar with a gradient in the background, and I want the top corners to be a little round with a 5px radius.
I've downloaded the curvy corners codes from the following address: http:[url]....
The instructions in the curvycorners.src.js file say that all i need to do is add the following piece of code which I've inserted into the head section:
I am using curvy corners, and it is working fine, as long as I only want one rounded box...I want (at least) two, and I am having trouble adding a second <div id> to the script.I'm not able to decipher much of javascript, and the explanation that came with the code isn't clear enough for me.Here's the code...
<script type="text/JavaScript"> window.onload = function() { var settings = {[code].....
It sounds confusing, but is quite simple. I have a square div, and using css I have four circles replacing the corners of the of the divs border. I want the user to be able to click on one of the corner circles changing the curser image and calling the Javascript onclick event. How do I did that?
I am trying to make a round corners script in object oriented programming method. This is purely for learning purposes.
The script is no where near complete but I am already having problems with it.
I am trying out the techniques described in 'David Flanagan ' text book 'JavaScript: The Definitive Guide, 5th Edition'
This code is called from html page which once working will place a round container around element
The selector parameter in Custom_rounded_container function is defined because only the else part of the if statement in Custom_rounded_container is executing. I put this in because few people at other forums thought the problem was because of the selector parameter being undefined.
i'm having with a superfish menu i have tried to add to my wordpress site.The menu seems to work fine for the base-level (top parent pages) menu items.But the drop down menus seem to flash on screen for just a second and then disappear when the mouse hovers over the menu items.To see an example, please check out the top menu on this temporary development page: http:[url].....I have tried adjusting the z-index in superfish.css file but it doesn't seem to be having any effect.
