Search Results

Search found 673 results on 27 pages for 'opacity'.

Page 24/27 | < Previous Page | 20 21 22 23 24 25 26 27  | Next Page >

  • Passing variables to shopping cart with Javascript

    - by albatross
    This question is an extension of this one: http://stackoverflow.com/questions/2359238/calculate-order-price-by-date-selection-value I'm trying to make a conference registration page based off the previous page, which passes the variables(name, email, price) to my organization's outdated shopping cart using javascript. I'm also using Seminar Registration by CSSTricks (http://css-tricks.com/examples/SeminarRegTutorial/) Currently, my proceed to payment button produces an 'element is undefined' error on line 298(same thing on unresolved previous question, linked above^): switch (document.Information.amount.value) { Any help would be greatly appreciated. I'm at my wits end with this. Here is the page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Seminar Registration Form with jQuery</title> <link rel="stylesheet" type="text/css" href="css/style.css" media="screen" /> <script src="js/jquery-1.2.6.js" type="text/javascript" charset="utf-8"></script> <script src="js/form-fun.jquery.js" type="text/javascript" charset="utf-8"></script> <!--[if IE]> <style type="text/css"> legend { position: relative; top: -30px; } fieldset { margin: 30px 10px 0 0; } </style> <script type="text/javascript"> $(function(){ $("#step_2 legend").css({ opacity: 0.5 }); $("#step_3 legend").css({ opacity: 0.5 }); }); </script> <![endif]--> </head> <body> <div id="page-wrap"> <h1>Conference <span>Registration</span></h1> <form action="#" method="post"> <fieldset id="step_1"> <legend>Step 1</legend> <label for="num_attendees"> How cool are you? </label> <select id="amount"> <option id="0" value="0">Please Choose</option> <option id="prof" value="90.00">Professional</option> <option id="grad" value="55.00">Graduate Student</option> </select> <br /> <div id="attendee_1_wrap" class="name_wrap push"> <h3>Who are you?</h3> <p> <label for="FirstName"> First Name: </label> <input type="text" id="FirstName" class="name_input"></input> </p> <p> <label for="LastName"> Last Name: </label> <input type="text" id="LastName" class="name_input"></input> </p> <p> <label for="OfficialTitle"> Official Title: </label> <input type="text" id="OfficialTitle" class="name_input"></input> </p> <h3>How do we find you?</h3> <label for="email">Email: </label> <input id="email" name="email" class="required email" /> </p> <p> <label for="Address">Street Address: </label><input name="Address" id="Address" type="text" size="20" maxlength="75" /> </p> <p> <label for="City">City: </label><input name="City" id="City" /> </p> <p> <label for="State">State: </label><select name="State" id="State"> <option selected value="IL">IL</option> <option value="AL">AL</option> <option value="AK">AK</option> <option value="AZ">AZ</option> <option value="AR">AR</option> <option value="CA">CA</option> <option value="CO">CO</option> <option value="CT">CT</option> <option value="DE">DE</option> <option value="DC">DC</option> <option value="FL">FL</option> <option value="GA">GA</option> <option value="HI">HI</option> <option value="ID">ID</option> <option value="IN">IN</option> <option value="IA">IA</option> <option value="KS">KS</option> <option value="KY">KY</option> <option value="LA">LA</option> <option value="ME">ME</option> <option value="MD">MD</option> <option value="MA">MA</option> <option value="MI">MI</option> <option value="MN">MN</option> <option value="MS">MS</option> <option value="MO">MO</option> <option value="MT">MT</option> <option value="NE">NE</option> <option value="NV">NV</option> <option value="NH">NH</option> <option value="NJ">NJ</option> <option value="NM">NM</option> <option value="NY">NY</option> <option value="NC">NC</option> <option value="ND">ND</option> <option value="OH">OH</option> <option value="OK">OK</option> <option value="OR">OR</option> <option value="PA">PA</option> <option value="RI">RI</option> <option value="SC">SC</option> <option value="SD">SD</option> <option value="TN">TN</option> <option value="TX">TX</option> <option value="UT">UT</option> <option value="VT">VT</option> <option value="VA">VA</option> <option value="WA">WA</option> <option value="WV">WV</option> <option value="WI">WI</option> <option value="WY">WY</option> </select> </p> <p> <label for="Zip">Zip Code: </label><input name="Zip" id="Zip" type="text" value="" size="5" maxlength="10" /> </p> <p> <label for="Phone">Telephone: </label><input name="Phone" id="Phone" type="text" value="" size="10" maxlength="13" /> </p> </div> </fieldset> <fieldset id="step_2"> <legend>Step 2</legend> <p> Do you work in Higher Education? </p> <input type="radio" id="company_name_toggle_on" name="company_name_toggle_group"></input> <label for="company_name_toggle_on">Yes</label> &emsp; <input type="radio" id="company_name_toggle_off" name="company_name_toggle_group"></input> <label for="company_name_toggle_off">No</label> <div id="company_name_wrap"> <label for="company_name"> Which School? </label> <input type="text" id="company_name"></input> </div> <div class="push"> <p> Will anyone in your group require special accommodations? </p> <input type="radio" id="special_accommodations_toggle_on" name="special_accommodations_toggle"></input> <label for="special_accommodations_toggle_on">Yes</label> &emsp; <input type="radio" id="special_accommodations_toggle_off" name="special_accommodations_toggle"></input> <label for="special_accommodations_toggle_off">No</label> </div> <div id="special_accommodations_wrap"> <label for="special_accomodations_text"> Please explain below: </label> <textarea rows="10" cols="10" id="special_accomodations_text"></textarea> </div> </fieldset> <fieldset id="step_3"> <legend>Step 3</legend> <label for="rock"> Are you ready to rock? </label> <input type="checkbox" id="rock"></input> <p> <INPUT onclick="javascript:PaymentButtonClick()" type=button value="Proceed to payment" name=PaymentButton> <img src="images/visa1.gif" /> <img src="images/mastercard1.gif" /> </p> </fieldset> </form> </div> <FORM name="emailForm" action="mailform.asp" method=post"> <INPUT type="hidden" value="Conference Registration" name="mf_subject"> <INPUT type="hidden" value="Yes" name="mf_email_results"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="20" name="num_attendees"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="FirstName"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="22" name="LastName"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="64" name="OfficialTitle"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="40" name="email"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="48" name="Address"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="City"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="State"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="Zip"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="Phone"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffa0" size="17" name="company_name"> <INPUT type="hidden" title="" style="BACKGROUND-COLOR: #ffffff" size="20" name="special_accomodations_text"> <INPUT type="hidden" value="[email protected]" name="mf_from"> <INPUT type="hidden" value="[email protected]" name="mf_to"> </FORM> <FORM name="addform" action="https://webcluster.niu.edu/CreditCard/servlet/Shopping_Cart_Add_Item_Servlet" method="post"> <INPUT type="hidden" value="orient" name="Dept_ID"> <INPUT type="hidden" value="Orientation" name="Product_Name"> <INPUT type="hidden" value="z000000" name="Product_Code"> <INPUT type="hidden" value="" name="amount"> <INPUT type="hidden" value="/orientation/index.shtml" name="return_link"> <INPUT type="hidden" value="http://www.niu.edu" name="return_server"> <INPUT type="hidden" value="1" name="quantity"> <INPUT type="hidden" value="0" name="tax"> <INPUT type="hidden" value="0" name="ship"> <INPUT type="hidden" value="DQ83225" name="sale_id"> <INPUT type="hidden" value="XXXXXX" name="sale_acct"> </FORM> <SCRIPT language="Javascript"> function PaymentButtonClick() { switch (document.Information.amount.value) { case 'prof': document.Information.amount.value = 90.00; break; case 'grad': document.Information.amount.value = 55.00; break; } document.addform.Product_Name.value = document.Information.FirstName.value + ","+ document.Information.LastName.value+","+ document.Information.OfficialTitle.value+","+ document.Information.email.name+","+","+ document.Information.Address.value+ "," + document.Information.City.value+ "," + document.Information.State.value+ "," + document.Information.Zip.value+ "," + document.Information.Phone.value+ "," + document.Information.company_name.value+ "," + document.Information.special_accomodations_text.value; document.addform.Product_Code.value = document.Information.LastName.value; if ((document.Information.UCheck.checked==true) && (document.Information.altDate1.value != "") && (document.Information.altDate1.value != "x")) { if (document.Information.StudentLastName.value != "" || document.Information.StudentFirstName.value != "" || document.Information.StudentID.value != "" ) { document.addform.submit(); } else { alert("Please enter missing information"); } } } </SCRIPT> </body> </html>

    Read the article

  • IE9 not rendering box-shadow Elements inside of Table Cells

    - by Rick Strahl
    Ran into an annoying problem today with IE 9. Slowly updating some older sites with CSS 3 tags and for the most part IE9 does a reasonably decent job of working with the new CSS 3 features. Not all by a long shot but at least some of the more useful ones like border-radius and box-shadow are supported. Until today I was happy to see that IE supported box-shadow just fine, but I ran into a problem with some old markup that uses tables for its main layout sections. I found that inside of a table cell IE fails to render a box-shadow. Below are images from Chrome (left) and IE 9 (right) of the same content: The download and purchase images are rendered with: <a href="download.asp" style="display:block;margin: 10px;"><img src="../images/download.gif" class="boxshadow roundbox" /></a> where the .boxshadow and .roundbox styles look like this:.boxshadow { -moz-box-shadow: 3px 3px 5px #535353; -webkit-box-shadow: 3px 3px 5px #535353; box-shadow: 3px 3px 5px #535353; } .roundbox { -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px; border-radius: 6px 6px 6px 6px; } And the Problem is… collapsed Table Borders Now normally these two styles work just fine in IE 9 when applied to elements. But the box-shadow doesn't work inside of this markup - because the parent container is a table cell.<td class="sidebar" style="border-collapse: collapse"> … <a href="download.asp" style="display:block;margin: 10px;"><img src="../images/download.gif" class="boxshadow roundbox" /></a> …</td> This HTML causes the image to not show a shadow. In actuality I'm not styling inline, but as part of my browser Reset I have the following in my master .css file:table { border-collapse: collapse; border-spacing: 0; } which has the same effect as the inline style. border-collapse by default inherits from the parent and so the TD inherits from table and tr - so TD tags are effectively collapsed. You can check out a test document that demonstrates this behavior here in this CodePaste.net snippet or run it here. How to work around this Issue To get IE9 to render the shadows inside of the TD tag correctly, I can just change the style explicitly NOT to use border-collapse:<td class="sidebar" style="border-collapse: separate; border-width: 0;"> Or better yet (thanks to David's comment below), you can add the border-collapse: separate to the .boxshadow style like this:.boxshadow { -moz-box-shadow: 3px 3px 5px #535353; -webkit-box-shadow: 3px 3px 5px #535353; box-shadow: 3px 3px 5px #535353; border-collapse: separate; } With either of these approaches IE renders the shadows correctly. Do you really need border-collapse? Should you bother with border-collapse? I think so! Collapsed borders render flat as a single fat line if a border-width and border-color are assigned, while separated borders render a thin line with a bunch of weird white space around it or worse render a old skool 3D raised border which is terribly ugly as well. So as a matter of course in any app my browser Reset includes the above code to make sure all tables with borders render the same flat borders. As you probably know, IE has all sorts of rendering issues in tables and on backgrounds (opacity backgrounds or image backgrounds) most of which is caused by the way that IE internally uses ActiveX filters to apply these effects. Apparently collapsed borders are yet one more item that causes problems with rendering. There you have it. Another crappy failure in IE we have to check for now, just one more reason to hate Internet Explorer. Luckily this one has a reasonably easy workaround. I hope this helps out somebody and saves them the hour I spent trying to figure out what caused this problem in the first place. Resources Sample HTML document that demonstrates the behavior Run the Sample© Rick Strahl, West Wind Technologies, 2005-2012Posted in HTML  Internet Explorer   Tweet !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();

    Read the article

  • CSS hover behavior inconsistent on desktop/mobile devices [migrated]

    - by tbart
    I have a strange problem: This page looks good on desktop browsers, but the hovering effect does not seem to work correctly on at least my CM7 Android 2.3.7 device. I know hovering is not supposed to work on touch displays as it does with a mouse, but I'd like to have touch feedback, i.e. the highlight color should show once the user has tapped a menu item. This does work when the link is just a href="#" but it does not when it is a real link. I tried all sorts of stuff as you can see, to no avail. If you go back in the browser history after having tapped a real link, the item is highlighted, so the browser understands the CSS I am throwing at it. However, the javascript alert makes it clear that it only seems to interpret the link opening action and does not care about the color changing stuff. Weird that is. Workarounds welcome, preferable without javascript, but if it has to be JS, then go ahead! either go here: http://orpheus.co.at/hoverprob and Use the source, Luke! or see it here in all its glory: <html> <head> <meta name="viewport" content="width=320"> <style> #nav, #nav ul { width: 100%; float: left; list-style: none; line-height: 1; background: #fff; font-weight: bold; padding: 0; margin: 0 0 5px 0; } #nav a { display: block; color: #001834; text-decoration: none; padding: 5px 7px; } #nav li { float: left; padding: 0; width: 33%; } #nav li ul { position: absolute; left: -9999px; height: auto; margin: 0; opacity: .95; width: 100%; } #nav li a { text-align: center; height: 20px; line-height: 20px; } #nav li ul li a { text-align: left; } #nav li ul li { float: none; /* width: 316px; */ width: 100%; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left: -9999px; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: 0; } #nav li.educate { background: #FFF0B8; /* background: #FF0000; */ /* border-radius: 5px; */ border: 5px; } #nav li.educate:hover { background: #FFCE00; /* border-radius: 5px; */ } </style> </head> <body> <div id="mobMenu"> <ul id="nav" class="nav"> <li class="educate"><a href="#">menu</a> <ul class="educate"> <li class="educate"><a href="#">href=&quot#&quot;, works</a></li> <!--(+emtpy onmouseover for iPose devices)--> <li class="educate"><a onmouseover="" href="index.html">does not work, real link</a></li> <li class="educate" id="bla"><a onmousedown="document.getElementById('bla').style.backgroundColor='Blue'; alert('Done');document.location='index.html';" href="#">JS, not interpreted in corr order</a></li> </ul> </li> </div> </body>

    Read the article

  • WPF MVVM Trigger Animation on MainWindow close

    - by Scott
    I'm using trying to implement MVVM in my app. I have a MainWindow.xaml and a MainWindowViewModel. I'm in the process of removing all of the code-behind code from the MainWindow.xaml but I'm stuck on one final piece. In my pre-MVVM setup I started an animation in the MainWindow.xaml.cs that would fade out the form before closing it. Since Closing is not a RoutedEvent, I had to use code-behind to get this to work. My VM has the following two properties that can be bound: ClosingWindow and CloseWindow. My goal was to bind a DataTrigger in my MainWindowStyle to the ClosingWindow property of the VM. When ClosingWindow was set to True, it would start an animation using the following XAML: <DataTrigger Binding="{Binding ClosingWindow}" Value="True"> <DataTrigger.EnterActions> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:2"/> </Storyboard> </BeginStoryboard> </DataTrigger.EnterActions> </DataTrigger> Somehow (insert magic here) I was going to set CloseWindow on the VM, via Binding, to True when the animation completed, which would then use an AttachedBehavior to Close the Window. The AttachedBehavior works perfectly when I just set CloseWindow directly using the following XAML: <DataTrigger Binding="{Binding CloseWindow}" Value="True"> <Setter Property="ab:WindowCloseBehavior.Close" Value="True"/> </DataTrigger> ...but I want to reproduce the form fade before the form actually closes. So there are two issues that I've run into: First, the animation doesn't work. I enter the trigger correctly (I've taken out the animation and put a Setter statement in there that changes the Title of the MainWindow to "Closing" and it changes correctly when ClosingWindow = True) but the DoubleAnimation never does anything. Second, there's no way to set the value of CloseWindow once the animation is complete. I looked at Marlon Grech's animation code but that won't work on DataTriggers. I can't publish a RoutedEvent because my VM doesn't descend from UIElement, and I've been Googling all day trying to come up with a clever, MVVM-friendly way to do this with no luck. So any ideas why that animation doesn't do anything? And more importantly, how would you solve the entire problem of animating a form fade on close from the VM? I don't doubt that my entire solution to this problem might be whacked so I'm open to just about anything.

    Read the article

  • Replacing GTileLayer in Google Maps v3, with ImageMapType, Tile bounding box?

    - by justdev
    I need to update this code: radar_layer.getTileUrl=function(tile,zoom) { var llp = new GPoint(tile.x*256,(tile.y+1)*256); var urp = new GPoint((tile.x+1)*256,tile.y*256); var ll = G_NORMAL_MAP.getProjection().fromPixelToLatLng(llp,zoom); var ur = G_NORMAL_MAP.getProjection().fromPixelToLatLng(urp,zoom); var dt = new Date(); var nowtime = dt.getTime(); var tileurl = "http://demo.remoteservice.com/cgi-bin/serve.cgi?"; tileurl+="bbox="+ll.lng()+","+ll.lat()+","+ur.lng()+","+ur.lat(); tileurl+="&width=256&height=256&reaspect=false&cachetime="+nowtime; return tileurl; }; I got as far as: var DemoLayer = new google.maps.ImageMapType({ getTileUrl: function(coord, zoom) { var llp = new google.maps.Point(coord.x*256,(coord.y+1)*256); var urp = new google.maps.Point((coord.x+1)*256,coord.y*256); var ll = googleMap.getProjection().fromPointToLatLng(llp); var ur = googleMap.getProjection().fromPointToLatLng(urp); var dt = new Date(); var nowtime = dt.getTime(); var tileurl = "http://demo.remoteservice.com/cgi-bin/serve.cgi?"; tileurl+="bbox="+ll.lng()+","+ll.lat()+","+ur.lng()+","+ur.lat(); tileurl+="&width=256&height=256&reaspect=false&cachetime="+nowtime; return tileurl; }, tileSize: new google.maps.Size(256, 256), opacity:1.0, isPng: true }); Specifically, I need help with this section: var llp = new google.maps.Point(coord.x*256,(coord.y+1)*256); var urp = new google.maps.Point((coord.x+1)*256,coord.y*256); var ll = googleMap.getProjection().fromPointToLatLng(llp); var ur = googleMap.getProjection().fromPointToLatLng(urp); The service wants the tile bounding box from what I understand. However, ll and ur do not seem to correct at all. I had it working and displaying the entire map bounding box in each tile, but of course that's not what I need. Any insight here would be greatly appreciated, not having the GTileLayers in V3 is fine if I can work around it, until then I'm frustrated.

    Read the article

  • CSS3 Gradients to reproduce an 'inner glow' effect from Illustrator with border-radius applied

    - by iamfriendly
    Hello all! First post on here so please be kind :) I am in the process of trying to get my head properly around CSS3 Gradients (specifically radial ones) and in doing so I think I've set myself a relatively tough challenge. In Adobe Illustrator I have created a 'button' style which can be seen here: http://bit.ly/aePPtV (jpg image). To create this image I created a rectangle with a background colour of rgb(63,64,63) or #3F403F, then 'stylized' it to have a 15px border radius. I then applied an 'inner glow' to it with a 25% opacity, 8px blur, white from the center. Finally, I applied a 3pt white stroke on it. (I'm telling you all of this in case you wished to reproduce it, if the image above isn't sufficient.) So, my question is thus: is it possible to recreate this 'button' using CSS without the need for an image? I am aware of the 'limitations' of Internet Explorer (and for the sake of this experiment, I couldn't give a monkeys). I am also aware of the small 'bug' in webkit which incorrectly renders an element with a background colour, border-radius and a border (with a different color to the background-color) - it lets the background color bleed through on the curved corners. My best attempt so far is fairly pathetic, but for reference here is the code: section#featured footer p a { color: rgb(255,255,255); text-shadow: 1px 1px 1px rgba(0,0,0,0.6); text-decoration: none; padding: 5px 10px; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; border: 3px solid rgb(255,255,255); background: rgb(98,99,100); background: -moz-radial-gradient( 50% 50%, farthest-side, #626364, #545454 ); background: -webkit-gradient( radial, 50% 50%, 1px, 50% 50%, 5px, from(rgb(98,99,100)), to(rgb(84,84,84)) ); } Basically, terrible. Any hints or tips gratefully accepted and thank you very much in advance for them!

    Read the article

  • Memory leak on CollectionView.View.Refresh

    - by Dabblernl
    I have defined my binding thus: <TreeView ItemsSource="{Binding UsersView.View}" ItemTemplate="{StaticResource MyDataTemplate}" /> The CollectionViewSource is defined thus: private ObservableCollection<UserData> users; public CollectionViewSource UsersView{get;set;} UsersView=new CollectionViewSource{Source=users}; UsersView.SortDescriptions.Add( new SortDescription("IsLoggedOn",ListSortDirection.Descending); UsersView.SortDescriptions.Add( new SortDescription("Username",ListSortDirection.Ascending); So far, so good, this works as expected: The view shows first the users that are logged on in alphabetical order, then the ones that are not. However, the IsLoggedIn property of the UserData is updated every few seconds by a backgroundworker thread and then the code calls: UsersView.View.Refresh(); on the UI thread. Again this works as expected: users that log on are moved from the bottom of the view to the top and vice versa. However: Every time I call the Refresh method on the view the application hoards 3,5MB of extra memory, which is only released after application shutdown (or after an OutOfMemoryException...) I did some research and below is a list of fixes that did NOT work: The UserData class implements INotifyPropertyChanged Changing the underlying users collection does not make any difference at all: any IENumerable<UserData as a source for the CollectionViewSource causes the problem. -Changing the ColletionViewSource to a List<UserData (and refreshing the binding) or inheriting from ObservableCollection to get access to the underlying Items collection to sort that in place does not work. I am out of ideas! Help? EDIT: I found it: The Resource MyDataTemplate contains a Label that is bound to a UserData object to show one of its properties, the UserData objects being handed down by the TreeView's ItemsSource. The Label has a ContextMenu defined thus: <ContextMenu Background="Transparent" Width="325" Opacity=".8" HasDropShadow="True"> <PrivateMessengerUI:MyUserData IsReadOnly="True" > <PrivateMessengerUI:MyUserData.DataContext> <Binding Path="."/> </PrivateMessengerUI:MyUserData.DataContext> </PrivateMessengerUI:MyUserData> </ContextMenu> The MyUserData object is a UserControl that shows All properties of the UserData object. In this way the user first only sees one piece of data of a user and on a right click sees all of it. When I remove the MyUserData UserControl from the DataTemplate the memory leak disappears! How can I still implement the behaviour as specified above?

    Read the article

  • problem with sIFR 3 not displaying in IE just getting XXX

    - by user288306
    I am having a problem with sIFR 3 not displaying in IE. I get 3 larges black XXX in IE yet it displays fine in Firefox. I have checked i do have the most recent version of flash installed correctly. Here is the code on the page <div id="features"> <div id="mainmessage_advertisers"><h2>Advertisers</h2><br /><br /><h3><a href="">Reach your customers where they browse. Buy directly from top web publishers.</a></h3><br /><br /><br /><a href=""><img src="img/buyads.gif" border="0"></a></div> <div id="mainmessage_publishers"><h2>Publishers</h2><br /><br /><h3>Take control of your ad space and start generating more revenue than <u>ever before</u>.</h3><br /><br /><br /><a href=""><img src="img/sellads.gif" border="0"></a></div> </div>` Here is the code from my global.css #mainmessage_advertisers { width: 395px; height: 200px; padding: 90px 50px; border: 1px; float: left; } #mainmessage_publishers { width: 395px; height: 200px; padding: 90px 50px; float: right; } and here is what i have in my sifr.js /*********************************************************************** SIFR 3.0 (BETA 1) FUNCTIONS ************************************************************************/ var parseSelector=(function(){var _1=/\s*,\s*/;var _2=/\s*([\s>+~(),]|^|$)\s*/g;var _3=/([\s>+~,]|[^(]\+|^)([#.:@])/g;var _4=/^[^\s>+~]/;var _5=/[\s#.:>+~()@]|[^\s#.:>+~()@]+/g;function parseSelector(_6,_7){_7=_7||document.documentElement;var _8=_6.split(_1),_9=[];for(var i=0;i<_8.length;i++){var _b=[_7],_c=toStream(_8[i]);for(var j=0;j<_c.length;){var _e=_c[j++],_f=_c[j++],_10="";if(_c[j]=="("){while(_c[j++]!=")"&&j<_c.length){_10+=_c[j]}_10=_10.slice(0,-1)}_b=select(_b,_e,_f,_10)}_9=_9.concat(_b)}return _9}function toStream(_11){var _12=_11.replace(_2,"$1").replace(_3,"$1*$2");if(_4.test(_12)){_12=" "+_12}return _12.match(_5)||[]}function select(_13,_14,_15,_16){return (_17[_14])?_17[_14](_13,_15,_16):[]}var _18={toArray:function(_19){var a=[];for(var i=0;i<_19.length;i++){a.push(_19[i])}return a}};var dom={isTag:function(_1d,tag){return (tag=="*")||(tag.toLowerCase()==_1d.nodeName.toLowerCase())},previousSiblingElement:function(_1f){do{_1f=_1f.previousSibling}while(_1f&&_1f.nodeType!=1);return _1f},nextSiblingElement:function(_20){do{_20=_20.nextSibling}while(_20&&_20.nodeType!=1);return _20},hasClass:function(_21,_22){return (_22.className||"").match("(^|\\s)"+_21+"(\\s|$)")},getByTag:function(tag,_24){return _24.getElementsByTagName(tag)}};var _17={"#":function(_25,_26){for(var i=0;i<_25.length;i++){if(_25[i].getAttribute("id")==_26){return [_25[i]]}}return []}," ":function(_28,_29){var _2a=[];for(var i=0;i<_28.length;i++){_2a=_2a.concat(_18.toArray(dom.getByTag(_29,_28[i])))}return _2a},">":function(_2c,_2d){var _2e=[];for(var i=0,_30;i<_2c.length;i++){_30=_2c[i];for(var j=0,_32;j<_30.childNodes.length;j++){_32=_30.childNodes[j];if(_32.nodeType==1&&dom.isTag(_32,_2d)){_2e.push(_32)}}}return _2e},".":function(_33,_34){var _35=[];for(var i=0,_37;i<_33.length;i++){_37=_33[i];if(dom.hasClass([_34],_37)){_35.push(_37)}}return _35},":":function(_38,_39,_3a){return (pseudoClasses[_39])?pseudoClasses[_39](_38,_3a):[]}};parseSelector.selectors=_17;parseSelector.pseudoClasses={};parseSelector.util=_18;parseSelector.dom=dom;return parseSelector})(); var sIFR=new function(){var _3b=this;var _3c="sIFR-active";var _3d="sIFR-replaced";var _3e="sIFR-flash";var _3f="sIFR-ignore";var _40="sIFR-alternate";var _41="sIFR-class";var _42="sIFR-layout";var _43="http://www.w3.org/1999/xhtml";var _44=6;var _45=126;var _46=8;var _47="SIFR-PREFETCHED";var _48=" ";this.isActive=false;this.isEnabled=true;this.hideElements=true;this.replaceNonDisplayed=false;this.preserveSingleWhitespace=false;this.fixWrap=true;this.registerEvents=true;this.setPrefetchCookie=true;this.cookiePath="/";this.domains=[];this.fromLocal=true;this.forceClear=false;this.forceWidth=true;this.fitExactly=false;this.forceTextTransform=true;this.useDomContentLoaded=true;this.debugMode=false;this.hasFlashClassSet=false;var _49=0;var _4a=false,_4b=false;var dom=new function(){this.getBody=function(){var _4d=document.getElementsByTagName("body");if(_4d.length==1){return _4d[0]}return null};this.addClass=function(_4e,_4f){if(_4f){_4f.className=((_4f.className||"")==""?"":_4f.className+" ")+_4e}};this.removeClass=function(_50,_51){if(_51){_51.className=_51.className.replace(new RegExp("(^|\\s)"+_50+"(\\s|$)"),"").replace(/^\s+|(\s)\s+/g,"$1")}};this.hasClass=function(_52,_53){return new RegExp("(^|\\s)"+_52+"(\\s|$)").test(_53.className)};this.create=function(_54){if(document.createElementNS){return document.createElementNS(_43,_54)}return document.createElement(_54)};this.setInnerHtml=function(_55,_56){if(ua.innerHtmlSupport){_55.innerHTML=_56}else{if(ua.xhtmlSupport){_56=["<root xmlns=\"",_43,"\">",_56,"</root>"].join("");var xml=(new DOMParser()).parseFromString(_56,"text/xml");xml=document.importNode(xml.documentElement,true);while(_55.firstChild){_55.removeChild(_55.firstChild)}while(xml.firstChild){_55.appendChild(xml.firstChild)}}}};this.getComputedStyle=function(_58,_59){var _5a;if(document.defaultView&&document.defaultView.getComputedStyle){_5a=document.defaultView.getComputedStyle(_58,null)[_59]}else{if(_58.currentStyle){_5a=_58.currentStyle[_59]}}return _5a||""};this.getStyleAsInt=function(_5b,_5c,_5d){var _5e=this.getComputedStyle(_5b,_5c);if(_5d&&!/px$/.test(_5e)){return 0}_5e=parseInt(_5e);return isNaN(_5e)?0:_5e};this.getZoom=function(){return _5f.zoom.getLatest()}};this.dom=dom;var ua=new function(){var ua=navigator.userAgent.toLowerCase();var _62=(navigator.product||"").toLowerCase();this.macintosh=ua.indexOf("mac")>-1;this.windows=ua.indexOf("windows")>-1;this.quicktime=false;this.opera=ua.indexOf("opera")>-1;this.konqueror=_62.indexOf("konqueror")>-1;this.ie=false/*@cc_on || true @*/;this.ieSupported=this.ie&&!/ppc|smartphone|iemobile|msie\s5\.5/.test(ua)/*@cc_on && @_jscript_version >= 5.5 @*/;this.ieWin=this.ie&&this.windows/*@cc_on && @_jscript_version >= 5.1 @*/;this.windows=this.windows&&(!this.ie||this.ieWin);this.ieMac=this.ie&&this.macintosh/*@cc_on && @_jscript_version < 5.1 @*/;this.macintosh=this.macintosh&&(!this.ie||this.ieMac);this.safari=ua.indexOf("safari")>-1;this.webkit=ua.indexOf("applewebkit")>-1&&!this.konqueror;this.khtml=this.webkit||this.konqueror;this.gecko=!this.webkit&&_62=="gecko";this.operaVersion=this.opera&&/.*opera(\s|\/)(\d+\.\d+)/.exec(ua)?parseInt(RegExp.$2):0;this.webkitVersion=this.webkit&&/.*applewebkit\/(\d+).*/.exec(ua)?parseInt(RegExp.$1):0;this.geckoBuildDate=this.gecko&&/.*gecko\/(\d{8}).*/.exec(ua)?parseInt(RegExp.$1):0;this.konquerorVersion=this.konqueror&&/.*konqueror\/(\d\.\d).*/.exec(ua)?parseInt(RegExp.$1):0;this.flashVersion=0;if(this.ieWin){var axo;var _64=false;try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash.7")}catch(e){try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash.6");this.flashVersion=6;axo.AllowScriptAccess="always"}catch(e){_64=this.flashVersion==6}if(!_64){try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash")}catch(e){}}}if(!_64&&axo){this.flashVersion=parseFloat(/([\d,?]+)/.exec(axo.GetVariable("$version"))[1].replace(/,/g,"."))}}else{if(navigator.plugins&&navigator.plugins["Shockwave Flash"]){var _65=navigator.plugins["Shockwave Flash"];this.flashVersion=parseFloat(/(\d+\.?\d*)/.exec(_65.description)[1]);var i=0;while(this.flashVersion>=_46&&i<navigator.mimeTypes.length){var _67=navigator.mimeTypes[i];if(_67.type=="application/x-shockwave-flash"&&_67.enabledPlugin.description.toLowerCase().indexOf("quicktime")>-1){this.flashVersion=0;this.quicktime=true}i++}}}this.flash=this.flashVersion>=_46;this.transparencySupport=this.macintosh||this.windows;this.computedStyleSupport=this.ie||document.defaultView&&document.defaultView.getComputedStyle&&(!this.gecko||this.geckoBuildDate>=20030624);this.css=true;if(this.computedStyleSupport){try{var _68=document.getElementsByTagName("head")[0];_68.style.backgroundColor="#FF0000";var _69=dom.getComputedStyle(_68,"backgroundColor");this.css=!_69||/\#F{2}0{4}|rgb\(255,\s?0,\s?0\)/i.test(_69);_68=null}catch(e){}}this.xhtmlSupport=!!window.DOMParser&&!!document.importNode;this.innerHtmlSupport;try{var n=dom.create("span");if(!this.ieMac){n.innerHTML="x"}this.innerHtmlSupport=n.innerHTML=="x"}catch(e){this.innerHtmlSupport=false}this.zoomSupport=!!(this.opera&&document.documentElement);this.geckoXml=this.gecko&&(document.contentType||"").indexOf("xml")>-1;this.requiresPrefetch=this.ieWin||this.khtml;this.verifiedKonqueror=false;this.supported=this.flash&&this.css&&(!this.ie||this.ieSupported)&&(!this.opera||this.operaVersion>=8)&&(!this.webkit||this.webkitVersion>=412)&&(!this.konqueror||this.konquerorVersion>3.5)&&this.computedStyleSupport&&(this.innerHtmlSupport||!this.khtml&&this.xhtmlSupport)};this.ua=ua;var _6b=new function(){function capitalize($){return $.toUpperCase()}this.normalize=function(str){if(_3b.preserveSingleWhitespace){return str.replace(/\s/g,_48)}return str.replace(/(\s)\s+/g,"$1")};this.textTransform=function(_6e,str){switch(_6e){case "uppercase":str=str.toUpperCase();break;case "lowercase":str=str.toLowerCase();break;case "capitalize":var _70=str;str=str.replace(/^\w|\s\w/g,capitalize);if(str.indexOf("function capitalize")!=-1){var _71=_70.replace(/(^|\s)(\w)/g,"$1$1$2$2").split(/^\w|\s\w/g);str="";for(var i=0;i<_71.length;i++){str+=_71[i].charAt(0).toUpperCase()+_71[i].substring(1)}}break}return str};this.toHexString=function(str){if(typeof (str)!="string"||!str.charAt(0)=="#"||str.length!=4&&str.length!=7){return str}str=str.replace(/#/,"");if(str.length==3){str=str.replace(/(.)(.)(.)/,"$1$1$2$2$3$3")}return "0x"+str};this.toJson=function(obj){var _75="";switch(typeof (obj)){case "string":_75="\""+obj+"\"";break;case "number":case "boolean":_75=obj.toString();break;case "object":_75=[];for(var _76 in obj){if(obj[_76]==Object.prototype[_76]){continue}_75.push("\""+_76+"\":"+_6b.toJson(obj[_76]))}_75="{"+_75.join(",")+"}";break}return _75};this.convertCssArg=function(arg){if(!arg){return {}}if(typeof (arg)=="object"){if(arg.constructor==Array){arg=arg.join("")}else{return arg}}var obj={};var _79=arg.split("}");for(var i=0;i<_79.length;i++){var $=_79[i].match(/([^\s{]+)\s*\{(.+)\s*;?\s*/);if(!$||$.length!=3){continue}if(!obj[$[1]]){obj[$[1]]={}}var _7c=$[2].split(";");for(var j=0;j<_7c.length;j++){var $2=_7c[j].match(/\s*([^:\s]+)\s*\:\s*([^\s;]+)/);if(!$2||$2.length!=3){continue}obj[$[1]][$2[1]]=$2[2]}}return obj};this.extractFromCss=function(css,_80,_81,_82){var _83=null;if(css&&css[_80]&&css[_80][_81]){_83=css[_80][_81];if(_82){delete css[_80][_81]}}return _83};this.cssToString=function(arg){var css=[];for(var _86 in arg){var _87=arg[_86];if(_87==Object.prototype[_86]){continue}css.push(_86,"{");for(var _88 in _87){if(_87[_88]==Object.prototype[_88]){continue}css.push(_88,":",_87[_88],";")}css.push("}")}return escape(css.join(""))}};this.util=_6b;var _5f={};_5f.fragmentIdentifier=new function(){this.fix=true;var _89;this.cache=function(){_89=document.title};function doFix(){document.title=_89}this.restore=function(){if(this.fix){setTimeout(doFix,0)}}};_5f.synchronizer=new function(){this.isBlocked=false;this.block=function(){this.isBlocked=true};this.unblock=function(){this.isBlocked=false;_8a.replaceAll()}};_5f.zoom=new function(){var _8b=100;this.getLatest=function(){return _8b};if(ua.zoomSupport&&ua.opera){var _8c=document.createElement("div");_8c.style.position="fixed";_8c.style.left="-65536px";_8c.style.top="0";_8c.style.height="100%";_8c.style.width="1px";_8c.style.zIndex="-32";document.documentElement.appendChild(_8c);function updateZoom(){if(!_8c){return}var _8d=window.innerHeight/_8c.offsetHeight;var _8e=Math.round(_8d*100)%10;if(_8e>5){_8d=Math.round(_8d*100)+10-_8e}else{_8d=Math.round(_8d*100)-_8e}_8b=isNaN(_8d)?100:_8d;_5f.synchronizer.unblock();document.documentElement.removeChild(_8c);_8c=null}_5f.synchronizer.block();setTimeout(updateZoom,54)}};this.hacks=_5f;var _8f={kwargs:[],replaceAll:function(){for(var i=0;i<this.kwargs.length;i++){_3b.replace(this.kwargs[i])}this.kwargs=[]}};var _8a={kwargs:[],replaceAll:_8f.replaceAll};function isValidDomain(){if(_3b.domains.length==0){return true}var _91="";try{_91=document.domain}catch(e){}if(_3b.fromLocal&&sIFR.domains[0]!="localhost"){sIFR.domains.unshift("localhost")}for(var i=0;i<_3b.domains.length;i++){if(_3b.domains[i]=="*"||_3b.domains[i]==_91){return true}}return false}this.activate=function(){if(!ua.supported||!this.isEnabled||this.isActive||!isValidDomain()){return}this.isActive=true;if(this.hideElements){this.setFlashClass()}if(ua.ieWin&&_5f.fragmentIdentifier.fix&&window.location.hash!=""){_5f.fragmentIdentifier.cache()}else{_5f.fragmentIdentifier.fix=false}if(!this.registerEvents){return}function handler(evt){_3b.initialize();if(evt&&evt.type=="load"){if(document.removeEventListener){document.removeEventListener("DOMContentLoaded",handler,false);document.removeEventListener("load",handler,false)}if(window.removeEventListener){window.removeEventListener("load",handler,false)}}}if(window.addEventListener){if(_3b.useDomContentLoaded&&ua.gecko){document.addEventListener("DOMContentLoaded",handler,false)}window.addEventListener("load",handler,false)}else{if(ua.ieWin){if(_3b.useDomContentLoaded&&!_4a){document.write("<scr"+"ipt id=__sifr_ie_onload defer src=//:></script>");document.getElementById("__sifr_ie_onload").onreadystatechange=function(){if(this.readyState=="complete"){handler();this.removeNode()}}}window.attachEvent("onload",handler)}}};this.setFlashClass=function(){if(this.hasFlashClassSet){return}dom.addClass(_3c,dom.getBody()||document.documentElement);this.hasFlashClassSet=true};this.removeFlashClass=function(){if(!this.hasFlashClassSet){return}dom.removeClass(_3c,dom.getBody());dom.removeClass(_3c,document.documentElement);this.hasFlashClassSet=false};this.initialize=function(){if(_4b||!this.isActive||!this.isEnabled){return}_4b=true;_8f.replaceAll();clearPrefetch()};function getSource(src){if(typeof (src)!="string"){if(src.src){src=src.src}if(typeof (src)!="string"){var _95=[];for(var _96 in src){if(src[_96]!=Object.prototype[_96]){_95.push(_96)}}_95.sort().reverse();var _97="";var i=-1;while(!_97&&++i<_95.length){if(parseFloat(_95[i])<=ua.flashVersion){_97=src[_95[i]]}}src=_97}}if(!src&&_3b.debugMode){throw new Error("sIFR: Could not determine appropriate source")}if(ua.ie&&src.charAt(0)=="/"){src=window.location.toString().replace(/([^:]+)(:\/?\/?)([^\/]+).*/,"$1$2$3")+src}return src}this.prefetch=function(){if(!ua.requiresPrefetch||!ua.supported||!this.isEnabled||!isValidDomain()){return}if(this.setPrefetchCookie&&new RegExp(";?"+_47+"=true;?").test(document.cookie)){return}try{_4a=true;if(ua.ieWin){prefetchIexplore(arguments)}else{prefetchLight(arguments)}if(this.setPrefetchCookie){document.cookie=_47+"=true;path="+this.cookiePath}}catch(e){if(_3b.debugMode){throw e}}};function prefetchIexplore(_99){for(var i=0;i<_99.length;i++){document.write("<embed src=\""+getSource(_99[i])+"\" sIFR-prefetch=\"true\" style=\"display:none;\">")}}function prefetchLight(_9b){for(var i=0;i<_9b.length;i++){new Image().src=getSource(_9b[i])}}function clearPrefetch(){if(!ua.ieWin||!_4a){return}try{var _9d=document.getElementsByTagName("embed");for(var i=_9d.length-1;i>=0;i--){var _9f=_9d[i];if(_9f.getAttribute("sIFR-prefetch")=="true"){_9f.parentNode.removeChild(_9f)}}}catch(e){}}function getRatio(_a0){if(_a0<=10){return 1.55}if(_a0<=19){return 1.45}if(_a0<=32){return 1.35}if(_a0<=71){return 1.3}return 1.25}function getFilters(obj){var _a2=[];for(var _a3 in obj){if(obj[_a3]==Object.prototype[_a3]){continue}var _a4=obj[_a3];_a3=[_a3.replace(/filter/i,"")+"Filter"];for(var _a5 in _a4){if(_a4[_a5]==Object.prototype[_a5]){continue}_a3.push(_a5+":"+escape(_6b.toJson(_6b.toHexString(_a4[_a5]))))}_a2.push(_a3.join(","))}return _a2.join(";")}this.replace=function(_a6,_a7){if(!ua.supported){return}if(_a7){for(var _a8 in _a6){if(typeof (_a7[_a8])=="undefined"){_a7[_a8]=_a6[_a8]}}_a6=_a7}if(!_4b){return _8f.kwargs.push(_a6)}if(_5f.synchronizer.isBlocked){return _8a.kwargs.push(_a6)}var _a9=_a6.elements;if(!_a9&&parseSelector){_a9=parseSelector(_a6.selector)}if(_a9.length==0){return}this.setFlashClass();var src=getSource(_a6.src);var css=_6b.convertCssArg(_a6.css);var _ac=getFilters(_a6.filters);var _ad=(_a6.forceClear==null)?_3b.forceClear:_a6.forceClear;var _ae=(_a6.fitExactly==null)?_3b.fitExactly:_a6.fitExactly;var _af=_ae||(_a6.forceWidth==null?_3b.forceWidth:_a6.forceWidth);var _b0=parseInt(_6b.extractFromCss(css,".sIFR-root","leading"))||0;var _b1=_6b.extractFromCss(css,".sIFR-root","background-color",true)||"#FFFFFF";var _b2=_6b.extractFromCss(css,".sIFR-root","opacity",true)||"100";if(parseFloat(_b2)<1){_b2=100*parseFloat(_b2)}var _b3=_6b.extractFromCss(css,".sIFR-root","kerning",true)||"";var _b4=_a6.gridFitType||_6b.extractFromCss(css,".sIFR-root","text-align")=="right"?"subpixel":"pixel";var _b5=_3b.forceTextTransform?_6b.extractFromCss(css,".sIFR-root","text-transform",true)||"none":"none";var _b6="";if(_ae){_6b.extractFromCss(css,".sIFR-root","text-align",true)}if(!_a6.modifyCss){_b6=_6b.cssToString(css)}var _b7=_a6.wmode||"";if(_b7=="transparent"){if(!ua.transparencySupport){_b7="opaque"}else{_b1="transparent"}}for(var i=0;i<_a9.length;i++){var _b9=_a9[i];if(!ua.verifiedKonqueror){if(dom.getComputedStyle(_b9,"lineHeight").match(/e\+08px/)){ua.supported=_3b.isEnabled=false;this.removeFlashClass();return}ua.verifiedKonqueror=true}if(dom.hasClass(_3d,_b9)||dom.hasClass(_3f,_b9)){continue}var _ba=false;if(!_b9.offsetHeight||!_b9.offsetWidth){if(!_3b.replaceNonDisplayed){continue}_b9.style.display="block";if(!_b9.offsetHeight||!_b9.offsetWidth){_b9.style.display="";continue}_ba=true}if(_ad&&ua.gecko){_b9.style.clear="both"}var _bb=null;if(_3b.fixWrap&&ua.ie&&dom.getComputedStyle(_b9,"display")=="block"){_bb=_b9.innerHTML;dom.setInnerHtml(_b9,"X")}var _bc=dom.getStyleAsInt(_b9,"width",ua.ie);if(ua.ie&&_bc==0){var _bd=dom.getStyleAsInt(_b9,"paddingRight",true);var _be=dom.getStyleAsInt(_b9,"paddingLeft",true);var _bf=dom.getStyleAsInt(_b9,"borderRightWidth",true);var _c0=dom.getStyleAsInt(_b9,"borderLeftWidth",true);_bc=_b9.offsetWidth-_be-_bd-_c0-_bf}if(_bb&&_3b.fixWrap&&ua.ie){dom.setInnerHtml(_b9,_bb)}var _c1,_c2;if(!ua.ie){_c1=dom.getStyleAsInt(_b9,"lineHeight");_c2=Math.floor(dom.getStyleAsInt(_b9,"height")/_c1)}else{if(ua.ie){var _bb=_b9.innerHTML;_b9.style.visibility="visible";_b9.style.overflow="visible";_b9.style.position="static";_b9.style.zoom="normal";_b9.style.writingMode="lr-tb";_b9.style.width=_b9.style.height="auto";_b9.style.maxWidth=_b9.style.maxHeight=_b9.style.styleFloat="none";var _c3=_b9;var _c4=_b9.currentStyle.hasLayout;if(_c4){dom.setInnerHtml(_b9,"<div class=\""+_42+"\">X<br />X<br />X</div>");_c3=_b9.firstChild}else{dom.setInnerHtml(_b9,"X<br />X<br />X")}var _c5=_c3.getClientRects();_c1=_c5[1].bottom-_c5[1].top;_c1=Math.ceil(_c1*0.8);if(_c4){dom.setInnerHtml(_b9,"<div class=\""+_42+"\">"+_bb+"</div>");_c3=_b9.firstChild}else{dom.setInnerHtml(_b9,_bb)}_c5=_c3.getClientRects();_c2=_c5.length;if(_c4){dom.setInnerHtml(_b9,_bb)}_b9.style.visibility=_b9.style.width=_b9.style.height=_b9.style.maxWidth=_b9.style.maxHeight=_b9.style.overflow=_b9.style.styleFloat=_b9.style.position=_b9.style.zoom=_b9.style.writingMode=""}}if(_ba){_b9.style.display=""}if(_ad&&ua.gecko){_b9.style.clear=""}_c1=Math.max(_44,_c1);_c1=Math.min(_45,_c1);if(isNaN(_c2)||!isFinite(_c2)){_c2=1}var _c6=Math.round(_c2*_c1);if(_c2>1&&_b0){_c6+=Math.round((_c2-1)*_b0)}var _c7=dom.create("span");_c7.className=_40;var _c8=_b9.cloneNode(true);for(var j=0,l=_c8.childNodes.length;j<l;j++){_c7.appendChild(_c8.childNodes[j].cloneNode(true))}if(_a6.modifyContent){_a6.modifyContent(_c8,_a6.selector)}if(_a6.modifyCss){_b6=_a6.modifyCss(css,_c8,_a6.selector)}var _cb=handleContent(_c8,_b5);if(_a6.modifyContentString){_cb=_a6.modifyContentString(_cb,_a6.selector)}if(_cb==""){continue}var _cc=["content="+_cb.replace(/\</g,"&lt;").replace(/>/g,"&gt;"),"width="+_bc,"height="+_c6,"fitexactly="+(_ae?"true":""),"tunewidth="+(_a6.tuneWidth||""),"tuneheight="+(_a6.tuneHeight||""),"offsetleft="+(_a6.offsetLeft||""),"offsettop="+(_a6.offsetTop||""),"thickness="+(_a6.thickness||""),"sharpness="+(_a6.sharpness||""),"kerning="+_b3,"gridfittype="+_b4,"zoomsupport="+ua.zoomSupport,"filters="+_ac,"opacity="+_b2,"blendmode="+(_a6.blendMode||""),"size="+_c1,"zoom="+dom.getZoom(),"css="+_b6];_cc=encodeURI(_cc.join("&amp;"));var _cd="sIFR_callback_"+_49++;var _ce={flashNode:null};window[_cd+"_DoFSCommand"]=(function(_cf){return function(_d0,arg){if(/(FSCommand\:)?resize/.test(_d0)){var $=arg.split(":");_cf.flashNode.setAttribute($[0],$[1]);if(ua.khtml){_cf.flashNode.innerHTML+=""}}}})(_ce);_c6=Math.round(_c2*getRatio(_c1)*_c1);var _d3=_af?_bc:"100%";var _d4;if(ua.ie){_d4=["<object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" id=\"",_cd,"\" sifr=\"true\" width=\"",_d3,"\" height=\"",_c6,"\" class=\"",_3e,"\">","<param name=\"movie\" value=\"",src,"\"></param>","<param name=\"flashvars\" value=\"",_cc,"\"></param>","<param name=\"allowScriptAccess\" value=\"always\"></param>","<param name=\"quality\" value=\"best\"></param>","<param name=\"wmode\" value=\"",_b7,"\"></param>","<param name=\"bgcolor\" value=\"",_b1,"\"></param>","<param name=\"name\" value=\"",_cd,"\"></param>","</object>","<scr","ipt event=FSCommand(info,args) for=",_cd,">",_cd,"_DoFSCommand(info, args);","</","script>"].join("")}else{_d4=["<embed class=\"",_3e,"\" type=\"application/x-shockwave-flash\" src=\"",src,"\" quality=\"best\" flashvars=\"",_cc,"\" width=\"",_d3,"\" height=\"",_c6,"\" wmode=\"",_b7,"\" bgcolor=\"",_b1,"\" name=\"",_cd,"\" allowScriptAccess=\"always\" sifr=\"true\"></embed>"].join("")}dom.setInnerHtml(_b9,_d4);_ce.flashNode=_b9.firstChild;_b9.appendChild(_c7);dom.addClass(_3d,_b9);if(_a6.onReplacement){_a6.onReplacement(_ce.flashNode)}}_5f.fragmentIdentifier.restore()};function handleContent(_d5,_d6){var _d7=[],_d8=[];var _d9=_d5.childNodes;var i=0;while(i<_d9.length){var _db=_d9[i];if(_db.nodeType==3){var _dc=_6b.normalize(_db.nodeValue);_dc=_6b.textTransform(_d6,_dc);_d8.push(_dc.replace(/\%/g,"%25").replace(/\&/g,"%26").replace(/\,/g,"%2C").replace(/\+/g,"%2B"))}if(_db.nodeType==1){var _dd=[];var _de=_db.nodeName.toLowerCase();var _df=_db.className||"";if(/\s+/.test(_df)){if(_df.indexOf(_41)){_df=_df.match("(\\s|^)"+_41+"-([^\\s$]*)(\\s|$)")[2]}else{_df=_df.match(/^([^\s]+)/)[1]}}if(_df!=""){_dd.push("class=\""+_df+"\"")}if(_de=="a"){var _e0=_db.getAttribute("href")||"";var _e1=_db.getAttribute("target")||"";_dd.push("href=\""+_e0+"\"","target=\""+_e1+"\"")}_d8.push("<"+_de+(_dd.length>0?" ":"")+escape(_dd.join(" "))+">");if(_db.hasChildNodes()){_d7.push(i);i=0;_d9=_db.childNodes;continue}else{if(!/^(br|img)$/i.test(_db.nodeName)){_d8.push("</",_db.nodeName.toLowerCase(),">")}}}if(_d7.length>0&&!_db.nextSibling){do{i=_d7.pop();_d9=_db.parentNode.parentNode.childNodes;_db=_d9[i];if(_db){_d8.push("</",_db.nodeName.toLowerCase(),">")}}while(i<_d9.length&&_d7.length>0)}i++}return _d8.join("").replace(/\n|\r/g,"")}}; sIFR.prefetch({ src: 'swf/sifr/helvetica.swf' }); sIFR.activate(); sIFR.replace({ selector: 'h2, h3', src: 'swf/sifr/helvetica.swf', wmode: 'transparent', css: { '.sIFR-root' : { 'color': '#000000', 'font-weight': 'bold', 'letter-spacing': '-1' }, 'a': { 'text-decoration': 'none' }, 'a:link': { 'color': '#000000' }, 'a:hover': { 'color': '#000000' }, '.span': { 'color': '#979797' }, 'label': { 'color': '#E11818' } } }); sIFR.replace({ selector: 'h4', src: 'swf/sifr/helvetica.swf', wmode: 'transparent', css: { '.sIFR-root' : { 'color': '#7E7E7E', 'font-weight': 'bold', 'letter-spacing': '-0.8' }, 'a': { 'text-decoration': 'none' }, 'a:link': { 'color': '#7E7E7E' }, 'a:hover': { 'color': '#7E7E7E' }, 'label': { 'color': '#E11818' } } }); sIFR.replace({ selector: '#cart p', src: 'swf/sifr/helvetica-lt.swf', wmode: 'transparent', css: { '.sIFR-root' : { 'color': '#979797', 'font-weight': 'bold', 'letter-spacing': '-0.8' }, 'a': { 'text-decoration': 'none' }, 'a:link': { 'color': '#979797' }, 'a:hover': { 'color': '#000000' }, 'label': { 'color': '#979797' } } }); Thank you in advance for your help!

    Read the article

  • not able to remove nested lists in a jQuery variable

    - by Pradyut Bhattacharya
    Hi I have a nested oredered list which i m animating using this code... var $li = $("ol#update li"); function animate_li(){ $li.filter(':first') .animate({ height: 'show', opacity: 'show' }, 500, function(){ animate_li(); }); $li = $li.not(':first'); } animate_li(); now i want not to show or animate the nested lists(ol s) or the li s in the ols take a look at the example here The structure of my ols are <ol> <li class="bar248"> <div class="nli"> <div class="pic"> <img src="dir/anonymous-thumb.png"alt="image" /> </div> <div align="left" class="text"> <span> <span class="delete_button"><a href="#" id="test" class="delete_update">R</a></span> test shouted <span class="timestamp"> 2010/02/24 18:34:26 </span> <br /> this </span> </div> <div class="clear"></div> </div> <div class="padd"> </div> <ol class="comment"> <li> <div>Testing </div> </li> <li> <div>Another Test </div> </li> </ol> </li> </ol> I m able to hide the nested ols using this code... $("ol#update li ol").hide(); But still time is being consumed in animating them although they are hidden I m not able to remove the nested li s using this code var $li = $("ol#update li").not("ol#update li ol"); $li = $li.not("ol#update li ol"); Take a look at this here Any help thanks < br Pradyut

    Read the article

  • jQuery Cycle plugin IE6/7 issues

    - by Aaron Moodie
    I've implemented a slideshow using the Cycle plugin, which is working in all browsers except IE6&7, where the images just show up in a list, and the #page_copy div is not hiding. I've been going through the code all day without any luck, and not exactly sure how or what I should be looking for. What would be the best way to go about debugging this issue? I know that the #page_copy div is hiding when I remove the rest of the code, and I've tried the reverse (which had no result) <script type="text/javascript" charset="utf-8"> jQuery.fn.fadeToggle = function(speed, easing, callback) { return this.animate({opacity: 'toggle'}, speed, easing, callback); }; $(document).ready(function() { $('#page_copy').hide(); $('a#info_close_button').click(function() { $('#page_copy').fadeOut(200); return false; }); $('a#info_button').click(function() { $('#page_copy').fadeToggle(200); return false; }); }); $(window).load(function() { // vertically center single image var $image_cnt = $("#images > img").size(); if($image_cnt < 2) { var $single_img = $("#images").children(':first-child'); var h = $single_img.height(); $single_img.css({ marginTop: (620 - h) / 2, }); $(".next").css("display","none"); $(".prev").css("display","none"); } }); // wait until images have loaded before starting cycle $(window).load(function() { // front image rotator $('#images').cycle({ fx: 'fade', speed: 300, next: '.next', prev: '.prev', containerResize: 0, timeout: 0, delay: -2000, before: onBefore }); }); // hide all but the first image when page loads $(document).ready(function() { $('#images img:gt(0)').hide(); }); // callback fired when each slide transition begins function onBefore(curr,next,opts) { var $slide = $(next); var w = $slide.width(); var h = $slide.height(); $slide.css({ marginTop: (620 - h) / 2, marginLeft: (650 - w) / 2 }); }; </script>

    Read the article

  • Why is jQuery .load() firing twice?

    - by LeslieOA
    Hello S-O. I'm using jQuery 1.4 with jQuery History and trying to figure out why Firebug/Web Inspector are showing 2 XHR GET requests on each page load (double that amount when visiting my sites homepage (/ or /#). e.g. Visit this (or any) page with Firebug enabled. Here's the edited/relevant code (see full source): - $(document).ready(function() { $('body').delegate('a', 'click', function(e) { var hash = this.href; if (hash.indexOf(window.location.hostname) > 0) { /* Internal */ hash = hash.substr((window.location.protocol+'//'+window.location.host+'/').length); $.historyLoad(hash); return false; } else if (hash.indexOf(window.location.hostname) == -1) { /* External */ window.open(hash); return false; } else { /* Nothing to do */ } }); $.historyInit(function(hash) { $('#loading').remove(); $('#container').append('<span id="loading">Loading...</span>'); $('#ajax').animate({height: 'hide'}, 'fast', 'swing', function() { $('#page').empty(); $('#loading').fadeIn('fast'); if (hash == '') { /* Index */ $('#ajax').load('/ #ajax','', function() { ajaxLoad(); }); } else { $('#ajax').load(hash + ' #ajax', '', function(responseText, textStatus, XMLHttpRequest) { switch (XMLHttpRequest.status) { case 200: ajaxLoad(); break; case 404: $('#ajax').load('/404 #ajax','', ajaxLoad); break; // Default 404 default: alert('We\'re experiencing technical difficulties. Try refreshing.'); break; } }); } }); // $('#ajax') }); // historyInit() function ajaxLoad() { $('#loading').fadeOut('fast', function() { $(this).remove(); $('#ajax').animate({height: 'show', opacity: '1'}, 'fast', 'swing'); }); } }); A few notes that may be helpful: - Using WordPress with default/standard .htaccess I'm redirecting /links-like/this to /#links-like/this via JavaScript only (PE) I'm achieving the above with window.location.replace(addr); and not window.location=addr; Feel free to visit my site if needed. Thanks in advanced.

    Read the article

  • Window out of the screen when maximized using WPF shell integration library

    - by Eduardo Molteni
    I'm using the WPF Shell Integration Library to create a custom chrome of my wpf app. All is good, but when maximizing the app, 6 or 7 pixels are out of the screen. This is the code I'm using: <Style TargetType="{x:Type local:MainWindow}"> <Setter Property="shell:WindowChrome.WindowChrome"> <Setter.Value> <shell:WindowChrome ResizeBorderThickness="6" CaptionHeight="10" CornerRadius="0" GlassFrameThickness="1"/> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:MainWindow}"> <Grid> <Border BorderThickness="1" BorderBrush="#389FD1" Background="#389FD1"> <ContentPresenter Margin="0,22,0,0" Content="{TemplateBinding Content}"/> </Border> <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" > <TextBlock Text="{Binding NombreUsuario}" Foreground="White" Margin="5,5,20,5" Opacity=".8" /> <Button Style="{StaticResource ImageButton}" Height="20" Width="20" Margin="0" Click="WindowMinimize" shell:WindowChrome.IsHitTestVisibleInChrome="True"> <Image Height="10" Width="10" Source="/Resources/Images/minimize.png" /> </Button> <Button Style="{StaticResource ImageButton}" Height="20" Width="20" Margin="0" Click="WindowMaximizeRestore" shell:WindowChrome.IsHitTestVisibleInChrome="True" > <Image Height="10" Width="10" Source="/Resources/Images/maximize.png" /> </Button> <Button Style="{StaticResource ImageButton}" Height="20" Width="20" Margin="0" Click="WindowClose" shell:WindowChrome.IsHitTestVisibleInChrome="True"> <Image Height="10" Width="10" Source="/Resources/Images/close.png" /> </Button> </StackPanel> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>

    Read the article

  • How to make multiple Popups using Jquery

    - by Rajasekar
    For pop up im using the following code style : a.selected { background-color:#1F75CC; color:white; z-index:100; } .messagepop { background-color:#FFFFFF; border:1px solid #999999; cursor:default; display:none; margin-top: 15px; position:absolute; text-align:left; width:394px; z-index:50; padding: 25px 25px 20px; } label { display: block; margin-bottom: 3px; padding-left: 15px; text-indent: -15px; } .messagepop p, .messagepop.div { border-bottom: 1px solid #EFEFEF; margin: 8px 0; padding-bottom: 8px; } JavaScript : $(function() { $("#contact").live('click', function(event) { $(this).addClass("selected").parent().append('<div class="messagepop pop"><form method="post" id="new_message" action="/messages"><p><label for="email">Your email or name</label><input type="text" size="30" name="email" id="email" /></p><p><label for="body">Message</label><textarea rows="6" name="body" id="body" cols="35"></textarea></p><p><input type="submit" value="Send Message" name="commit" id="message_submit"/> or <a class="close" href="/">Cancel</a></p></form></div>'); $(".pop").slideFadeToggle() $("#email").focus(); return false; }); $(".close").live('click', function() { $(".pop").slideFadeToggle(); $("#contact").removeClass("selected"); return false; }); }); $.fn.slideFadeToggle = function(easing, callback) { return this.animate({ opacity: 'toggle', height: 'toggle' }, "fast", easing, callback); }; and finally <a href="/contact" id="contact">Contact Us</a> I need to include another pop up when the register link is clicked. Whether i should use the same function with modifications or seperate functions. Please provide me the code with modifications. Im so weird. Help me.

    Read the article

  • Nested Sortable JQuery list doesn't work in IE while it does in FF

    - by Ben Fransen
    Hello everybody, While I'm using this site quite often as a resource for jQuery related problems I can't seem to find an answer this time. So here is my first post. During daytime at work I'm developing an informationsystem for generating MS Word documents. One of the modules I'm developing is for defining a default chapterselection for the table of contents and selecting texts by the given chapters. A user can submit new chapters and if necessary, add them as childchapter to a parent, flag them as 'adopt in TOC' and link a default text (from another module) to the chapter. My chapterlist is retreived recursively from a MySQL table and could look something like this: <ul class="sortableChapterlist"> <li>1</li> <li>2 <ul class="sortableChapterlist"> <li>2.1</li> <li>2.2</li> <li>2.3 <ul class="sortableChapterlist"> <li>2.3.1</li> <li>2.3.2</li> </ul> </li> </ul> </li> </ul> In FireFox the code works like a charm but IE (7) doesn't seem to like it that much. I'm only able to correctly drag arround the mainchapters. When attempting to drag a subchapter, no matter it's level, the correspondending mainchapter lifts up with some child, never all. This is the jQuery code I'm using to accomplish the task: $(function(){ $(".sortableChapterlist").sortable({ opacity: 0.7, helper: 'clone', cursor: 'move' }); $(".sortableChapterlist").selectable(); $(".sortableChapterlist").disableSelection(); }); Does anybody have some ideas about this? I'm guessing IE kinda falls over the multiple class reference "chapter_list" in combination with jQuery trying to handle the draggable/sortable. Kinds regards from Holland, Ben Fransen

    Read the article

  • z-index issues with jQuery Tabs, Superfish Menu

    - by NightMICU
    Hi all, For the life of me I cannot get my Superfish menu to stop hiding behind my jQuery UI tabs in IE 7. I have read the documentation out there, have tried changing z-index values and tried the bgIframe plugin, although I am not sure if I am implementing it correctly (left out in my example below, using Supersubs). Here is the Javascript I am using for Superfish - using the Supersubs plugin: $(document).ready(function() { $("ul.sf-menu").supersubs({ minWidth: 12, // minimum width of sub-menus in em units maxWidth: 27, // maximum width of sub-menus in em units extraWidth: 1 // extra width can ensure lines don't sometimes turn over // due to slight rounding differences and font-family }).superfish({ delay: 1000, // one second delay on mouseout animation: {opacity:'show',height:'show'}, // fade-in and slide-down animation speed: 'medium' // faster animation speed }); }); And here is the structure of my page: <div id="page-container"> <div id="header"></div> <div id="nav-admin"> <!-- This is where Superfish goes --> </div> <div id="header-shadow"></div> <div id="content"> <div id="admin-main"> <div id="tabs"> <ul> <li><a href="#tabs-1">Tab 1</a></li> <li><a href="#tabs-2">Tab 2</a></li> </ul> <div id="tabs-1"> <!-- Content for Tab 1 --> </div> <div id="tabs-2"> <!-- Content for Tab 2 --> </div> </div> </div> </div> <div id="footer-shadow"></div> <div id="footer"> <div id="alt-nav"> <?php include $_SERVER['DOCUMENT_ROOT'] . '/includes/altnav.inc.php'; //CHANGE WHEN UPLOADED TO MATCH DOCUMENT ROOT ?> </div> </div> </div>

    Read the article

  • jQuery galleria plugin with dynamically loaded images

    - by panas
    I'm using the Galleria plugin with jQuery to create my image gallery. I'm trying to get load images dynamically from the user's selection into the DOM and have the gallery auto-update to display those new images but it's not working. Firebug shows the images are successfully loading into the DOM but Galleria displays no thumbnails. I need a way to reload Galleria to display the new images. /* ---- Gallery Code ---- */ if ($(this).find('div').attr('title') == 'photogallery' && $('.galleria_container').length == 0) { $('.gallery').galleria( { history : false, clickNext : true, onImage : function(image,caption,thumb) { if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1) ) { image.css('display','none').fadeIn(1000); } var _li = thumb.parents('li'); caption.css('display','none').fadeIn(1000); _li.siblings().children('img.selected').fadeTo(500,0.3); thumb.fadeTo('fast',1).addClass('selected'); image.attr('title','Next image >>'); }, onThumb : function(thumb) { var _li = thumb.parents('li'); var _fadeTo = _li.is('.active') ? '1' : '0.3'; thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500); thumb.hover ( function() { thumb.fadeTo('fast',1); }, function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active ) } }); } /* ---- Gallery Selector ---- */ $(document).ready(function() { var galleryImages = new Object(); <?php echo $myGal; ?> function setImages(type) { var image = ''; for (var i = 0; i < galleryImages[type].length; i++) { image += '<li><img src="' + galleryImages[type][i] + '"></li>'; } $('ul.gallery').html(image); } $('ul.menu-horiz li ul li').click(function() { setImages($(this).attr('rel')); }); }); The PHP code you see just creates an array of images. So to summarise my question: How can I reload Galleria once the new images have been loaded into the DOM?

    Read the article

  • jQuery CSS plugin that returns computed style of element to pseudo clone that element?

    - by Keith Bentrup
    I'm looking for a way using jQuery to return an object of computed styles for the 1st matched element. I could then pass this object to another call of jQuery's css method. For example, with width, I can do the following to make the 2 divs have the same width: $('#div2').width($('#div1').width()); It would be nice if I could make a text input look like an existing span: $('#input1').css($('#span1').css()); where .css() with no argument returns an object that can be passed to .css(obj). (I can't find a jQuery plugin for this, but it seems like it should exist. If it doesn't exist, I'll turn mine below into a plugin and post it with all the properties that I use.) Basically, I want to pseudo clone certain elements but use a different tag. For example, I have an li element that I want to hide and put an input element over it that looks the same. When the user types, it looks like they are editing the element inline. I'm also open to other approaches for this pseudo cloning problem for editing. Any suggestions? Here's what I currently have. The only problem is just getting all the possible styles. This could be a ridiculously long list. jQuery.fn.css2 = jQuery.fn.css; jQuery.fn.css = function() { if (arguments.length) return jQuery.fn.css2.apply(this, arguments); var attr = ['font-family','font-size','font-weight','font-style','color', 'text-transform','text-decoration','letter-spacing','word-spacing', 'line-height','text-align','vertical-align','direction','background-color', 'background-image','background-repeat','background-position', 'background-attachment','opacity','width','height','top','right','bottom', 'left','margin-top','margin-right','margin-bottom','margin-left', 'padding-top','padding-right','padding-bottom','padding-left', 'border-top-width','border-right-width','border-bottom-width', 'border-left-width','border-top-color','border-right-color', 'border-bottom-color','border-left-color','border-top-style', 'border-right-style','border-bottom-style','border-left-style','position', 'display','visibility','z-index','overflow-x','overflow-y','white-space', 'clip','float','clear','cursor','list-style-image','list-style-position', 'list-style-type','marker-offset']; var len = attr.length, obj = {}; for (var i = 0; i < len; i++) obj[attr[i]] = jQuery.fn.css2.call(this, attr[i]); return obj; } Edit: I've now been using the code above for awhile. It works well and behaves exactly like the original css method with one exception: if 0 args are passed, it returns the computed style object. As you can see, it immediately calls the original css method if that's the case that applies. Otherwise, it gets the computed styles of all the listed properties (gathered from Firebug's computed style list). Although it's getting a long list of values, it's quite fast. Hope it's useful to others.

    Read the article

  • jQuery tools modal overlay display problem in IE6-8

    - by Michael Stone
    I'm trying to enable the overlay to be modal. It works perfectly fine in FireFox, but the window object is behind the mask when it becomes modal. This prevents any interaction with it and the page is actually useless. I've tried debugging this for a while and can't figure it out. Here is a link to the example on their site: http://flowplayer.org/tools/demos/overlay/modal-dialog.html $.fn.cfwindow = function(btnEvent,modal,draggable){ //error checking if(btnEvent == ""){ alert('Error in window :\n Please provide an id that instantiates the window. '); } if(!modal && !draggable){ $('#'+btnEvent+'[rel]').overlay(); $('#content_overlay').css('cursor','default'); } if(!modal && draggable){ $('#'+btnEvent+'[rel]').overlay(); $('#content_overlay').css('cursor','move'); $('#custom').draggable(); } if(modal){ $('#'+btnEvent+'[rel]').overlay({ // some mask tweaks suitable for modal dialogs mask: { color: '#646464', loadSpeed: 200, opacity: 0.6 }, closeOnClick: false }); $('#content_overlay').css('cursor','default'); //$('#custom').addClass('modal'); } }; That's what I'm referencing when I call through: <script type="text/javascript"> $(document).ready(function(){ $(document).pngFix(); var modal = <cfoutput>#attributes.modal#; var drag = #attributes.draggable#; var btn = '#attributes.selector#'; var src = '#attributes.source#'; var wid = '#attributes.width#'; $('##custom').width(parseInt(wid)); $('div##load_content').load(src); $('##custom').cfwindow(btn,modal,drag,wid); }); </script> CSS for the modal: <style type="text/css"> .modal { display:none; text-align:left; background-color:#FFFFFF; -moz-border-radius:6px; -webkit-border-radius:6px; } </style> Exclude the and the additional pound signs, IE. "##". Screen shot of the problem: http://twitpic.com/1tak06 Note: IE6 and IE8 have the same problem. Any help would be appreciated.

    Read the article

  • Jquery Tools Overlay call on javascript function

    - by user342944
    Hi Guys, I have a jquery overlay window in my html alongwith a button to activate here is the code. <!-- Validation Overlay Box --> <div class="modal" id="yesno" style="top: 100px; left: 320px; position: relative; display: none; z-index: 0; margin-top: 100px;"> <h2> &nbsp;&nbsp;Authentication Failed</h2> <p style="font-family:Arial; font-size:small; text-align:center"> Ether your username or password has been entered incorrectly. Please make sure that your username or password entered correctly... </p> <!-- yes/no buttons --> <p align="center"> <button class="close"> OK </button> </p> </div> Here is the Jquery tools Script <SCRIPT> $(document).ready(function() { var triggers = $(".modalInput").overlay({ // some mask tweaks suitable for modal dialogs mask: { color: '#a2a2a2', loadSpeed: 200, opacity: 0.9 }, closeOnClick: false }); var buttons = $("#yesno button").click(function(e) { // get user input var yes = buttons.index(this) === 0; // do something with the answer triggers.eq(0).html("You clicked " + (yes ? "yes" : "no")); }); $("#prompt form").submit(function(e) { // close the overlay triggers.eq(1).overlay().close(); // get user input var input = $("input", this).val(); // do something with the answer triggers.eq(1).html(input); // do not submit the form return e.preventDefault(); }); }); And here how its called upon clicking on a button or a hyperlink "<BUTTON class="modalInput" rel="#yesno">You clicked no</BUTTON>" All i want is I dont want to show the overlay on clicking on button or through a link. Is it possible to call it through a javascript function like "showOverlay()" ??

    Read the article

  • Java Nimbus LAF with transparent text fields

    - by Software Monkey
    I have an application that uses disabled JTextFields in several places which are intended to be transparent - allowing the background to show through instead of the text field's normal background. When running the new Nimbus LAF these fields are opaque (despite setting setOpaque(false)), and my UI is broken. It's as if the LAF is ignoring the opaque property. Setting a background color explicitly is both difficult in several places, and less than optimal due to background images actually doesn't work - it still paints it's LAF default background over the top, leaving a border-like appearance (the splash screen below has the background explicitly set to match the image). Any ideas on how I can get Nimbus to not paint the background for a JTextField? Note: I need a JTextField, rather than a JLabel, because I need the thread-safe setText(), and wrapping capability. Note: My fallback position is to continue using the system LAF, but Nimbus does look substantially better. See example images below. Conclusions The surprise at this behavior is due to a misinterpretation of what setOpaque() is meant to do - from the Nimbus bug report: This is a problem the the orginal design of Swing and how it has been confusing for years. The issue is setOpaque(false) has had a side effect in exiting LAFs which is that of hiding the background which is not really what it is ment for. It is ment to say that the component my have transparent parts and swing should paint the parent component behind it. It's unfortunate that the Nimbus components also appear not to honor setBackground(null) which would otherwise be the recommended way to stop the background painting. Setting a fully transparent background seems unintuitive to me. In my opinion, setOpaque()/isOpaque() is a faulty public API choice which should have been only: public boolean isFullyOpaque(); I say this, because isOpaque()==true is a contract with Swing that the component subclass will take responsibility for painting it's entire background - which means the parent can skip painting that region if it wants (which is an important performance enhancement). Something external cannot directly change this contract (legitimately), whose fulfillment may be coded into the component. So the opacity of the component should not have been settable using setOpaque(). Instead something like setBackground(null) should cause many components to "no long have a background" and therefore become not fully opaque. By way of example, in an ideal world most components should have an isOpaque() that looks like this: public boolean isOpaque() { return (background!=null); }

    Read the article

  • Why does UIWebKit throw a structuralComplexityContribution exception?

    - by Axeva
    I've got a simple UIWebView in my iPhone app that's loading a XHTML document with some SGV embeded. This all works find on the desktop version of Safari, but it crashes in a UIWebView. Here is the Objective C: NSString *path = [[NSBundle mainBundle] pathForResource:@"test" ofType:@"html"]; NSData *fileData = [NSData dataWithContentsOfFile: path]; [svgView loadData: fileData MIMEType: @"text/xml" textEncodingName: @"UTF-8" baseURL: [NSURL fileURLWithPath: path]]; I also tried a MIMEType of application/xhtml+xml, but it didn't help. Here is the HTML: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>XTech SVG Demo</title> </head> <body> <svg xmlns="http://www.w3.org/2000/svg"> <g style="fill-opacity:0.7;"> <circle cx="6.5cm" cy="2cm" r="100" style="fill:red; stroke:black; stroke-width:0.1cm" transform="translate(0,50)" /> <circle cx="6.5cm" cy="2cm" r="100" style="fill:blue; stroke:black; stroke-width:0.1cm" transform="translate(70,150)" /> <circle cx="6.5cm" cy="2cm" r="100" style="fill:green; stroke:black; stroke-width:0.1cm" transform="translate(-70,150)"/> </g> </svg> </body> </html> All very basic stuff. When it loads on the iPhone, however, it crashes with this error: 2010-03-31 10:37:10.252 ColorDoodle[2014:20b] -[DOMElement structuralComplexityContribution]: unrecognized selector sent to instance 0x3e51b60 2010-03-31 10:37:10.253 ColorDoodle[2014:20b] Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: ' -[DOMElement structuralComplexityContribution]: unrecognized selector sent to instance 0x3e51b60' Any idea why? Is this a bug in the rendering engine of the UIWebView? I don't see anything too odd here. * Updated * There is definitely something screwy going on here. If I add this bit of code just inside the tag, it works fine: <form> </form> Take that code back out, and it crashes again.

    Read the article

  • Can't Prevent Nested Div's from Overflowing when using Percent Sizes and Padding in CSS?

    - by viatropos
    I want to be able to layout nested divs with these properties: width: 100% height: 100% padding: 10px I want it to be such that, the children are 100% width and height of the remaining space after padding is calculated, not before. Otherwise, when I have a document like the below example, the child makes the scrollbars appear. But the scrollbars are not the main issue, the fact that the child stretches beyond the width of the parent container is. I can use all position: absolute declarations, but that doesn't seem right. Here is the code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=7"> <title>Liquid Layout</title> <style> body, html { width:100%; height:100%; margin:0; padding:0; background-color:black; } #container { position:relative; width:100%; height:100%; background-color:red; opacity:0.7; } #child1 { position:relative; width:100%; height:100%; padding:10px; background-color:blue; } #nested1 { position:relative; background-color: white; width:100%; height:100%; } </style> </head> <body> <div id="container"> <div id="child1"> <div id="nested1"></div> </div> </div> </body> </html> How do I make it so, using position:relative or position:static, and percent sizes, the percents size the children according to the parent's width/height minus padding and margins? Do I have to resort to position:absolute and left/right/top/bottom? Thanks for the help, Lance

    Read the article

  • understanding logic of dijit css and styles

    - by Tom
    Hi, I am trying to use dijit.InlineEditBox. I have put the following code in my HTML, using the example in the dojo docs: <script type="text/javascript"> dojo.require("dijit.InlineEditBox"); dojo.require("dojo.parser"); dojo.require("dijit.form.TextBox"); function editableHeaderOnChange(id, arg){ alert("details changed with id " + id + " and arguments "+arg); } </script> ... <span id="myText" dojoType="dijit.InlineEditBox" onChange="editableHeaderOnChange(this.id,arguments[0])" autoSave="true" title="My Text">click to edit me</span> I am using tundra theme. It works, however it doesn't look so good. The widget has its own style, which doesn't fit my CSS. I used firebug to locate the source of the problem. The widget creates many nested div/span elements, each has it's own style (element style in firebug): <span id="dijit__InlineEditor_0" class="dijitReset dijitInline" style="margin: 0px; position: absolute; visibility: hidden; display: block; opacity: 0;" ...> <input type="text" autocomplete="off" class="dijit dijitReset dijitLeft dijitTextBox" id="dijit_form_TextBox_0" style="line-height: 20px; font-weight: 400; font-family: Trebuchet MS,Helvetica,Arial,Verdana; font-size: 14.5167px; font-style: normal; width: 100%;"> ...> </span></span> (showing only the relevant parts...) to get the visual that I want, which will not break to a newline, I need to change the width of dijit_form_TextBox_0** to 50%, and the positioning of dijit__InlineEditor_0 to display: inline**; or to change the positioning of everything (most of my layout is floated, so position: absolute doesn't fit) I cannot address those span elements in my css to change the properties, because the element.style has priority, of course. I don't understand the logic in this system... why is dijit generating the style directly inside the element? how can I change these properties? Thanks Tom

    Read the article

  • jQyery bind on ajax load() event

    - by Andrei C
    Hi guys. I have a page which display multiple blocks with results details. Inside each block I have some tags with thichbox jQuery plugin attached( class="thichbox"). http://jquery.com/demo/thickbox/ here is an example of one kind of ampersant tag: <a class="thickbox" title="Please Sign In" href="userloginredir.php?height=220&width=350&deal=3"> Problem comes when I added a jQuery pagination to the page because of to many results displaying on the page. The div component with the results inside is updated through ajax load() event. Below is the pagination script. $(document).ready(function(){ //References var pages = $("#menu_deals li"); var loading = $("#loading_deals"); var content = $("#content_deals"); //show loading bar function showLoading(){ loading .css({visibility:"visible"}) .css({opacity:"1"}) .css({display:"block"}) ; } //hide loading bar function hideLoading(){ loading.fadeTo(1000, 0); }; //Manage click events pages.live('click',function(){ //show the loading bar showLoading(); //Highlight current page number pages.css({'background-color' : ''}); $(this).css({'background-color' : 'yellow'}); //Load content var pageNum = this.id; var targetUrl = "ajax_search_results.php?page=" + pageNum + "&" + $("#dealsForm").serialize() + " #content_d"; content.load(targetUrl, hideLoading); }); //default - 1st page $("#1").css({'background-color' : 'yellow'}); var targetUrl = "ajax_search_results.php?page=1&" + $("#dealsForm").serialize() + " #content_d"; showLoading(); content.load(targetUrl, hideLoading); }); When I added pagination(code above), the thickbox events are not recognized anymore and instead of poping out a window with the login form inside it opens the results in new page (is acting like clicking on a normal link) From my jQuery knowledge this means that the components are not defined in the DOM because the content is updated after document ready triggered. I'm trying to bind the load event with something like this: content.bind('load',???); But I don't know how to pass the load params, targetUrl and the callback function hideLoading, when binding the load event. Please help me out in this matter, already took me more time than possible allowed. Thank you!

    Read the article

  • html transparent background

    - by amarsh-anand
    I want to create a webpage with transparent background, a table and some text. I have seen posts related to this, but due to my lack of familiarity with css, I somehow cant get my code to work. I just want a transparent background, while this code is making everything transparent. Can someone kindly help. <html> <head><style type="text/css"> div.transbg {background-color:#4a6c9b; opacity:0.6;} </style></head> <div class="transbg"> <body><Center><font color="#FFFFFF"> <b>Toll Charges</b> <table bgcolor="#000000" cellspacing=3> <tr> <td bgcolor="#009900"><font color="#FFFFFF" align="left"> &nbsp; &nbsp;Class 2 inc Private&nbsp;</font></td> <td bgcolor="#009900"><font color="#FFFFFF" align="right"> &nbsp;A$ 4.95 &nbsp;</font></td> </tr> <tr> <td bgcolor="#009900"><font color="#FFFFFF" align="left"> &nbsp; &nbsp;Class 2 inc Commercial&nbsp;</font></td> <td bgcolor="#009900"><font color="#FFFFFF" align="right"> &nbsp;A$ 13.95 &nbsp;</font></td> </tr> </table> <br> Toll has to be paid within 48 hrs of passage, else an additional A$ 13.95 of administration charges would be added </font></Center> </div> </body> </html>

    Read the article

< Previous Page | 20 21 22 23 24 25 26 27  | Next Page >