I'm puzzled as to why the code snippet below only works in Firefox, but not in Chrome and Safari. Can you shed some light on this issue?
if ($(this).css("color") == "Fuchsia"){ $(this).css("color","#000000"); }
Here is the link in question:
If you scroll down and up, you'll notice that "Eternal Tour" changes color from purple to black again in Firefox because it is no longer selected. However, in Chrome and Safari, it remains black throughout.
Remember to write it in lowercase: fuchsia.
It would be beneficial to investigate the output of $(this).color(), although it seems like the main issue lies in the fact that chrome/safari provide a value in hex code, making it incompatible for comparison with a string.
You may want to try comparing it against #FF00FF.
Give this a shot
if ($(*).css("color") == "fuchsia"){ $(this).css("color","#000000"); }
function switchNoteColor(obj) {
var currentColor = rgbToHex(jQuery(obj).css('color'));
if (currentColor == '#000000') {
jQuery(obj).css('color', '#ff0000');
}
else {
jQuery(obj).css('color', '#000000');
}
}
function rgbToHex(rgb) {
if (/^#[0-9a-f]{3}([0-9a-f]{3})?$/i.test(rgb)) {
return rgb;
}
rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
return "#" +
("0" + parseInt(rgb[1], 10).toString(16)).slice(-2) +
("0" + parseInt(rgb[2], 10).toString(16)).slice(-2) +
("0" + parseInt(rgb[3], 10).toString(16)).slice(-2);
}
var timer;
toggleTimer();
function toggleTimer()
{
if (document.getElementById("<%=fullDataEntryNotes.ClientID%>")) {
var fullDataEntryNotes = document.getElementById("<%=fullDataEntryNotes.ClientID %>");
switchNoteColor(fullDataEntryNotes);
}
timer = window.setTimeout('toggleTimer()', 750);
}
The HTML code breaks my post, so let me explain it here. Create a div with text inside, styled initially in black (#000000). Every 750 milliseconds, the color toggles between black and red.
In my application, the homepage's carousel displays multiple images with dynamically generated anchor tags that link to different routes. When clicking on the anchor tag, the page scrolls to the linked image but is obstructed by a fixed header. I want ...
Is there a way to notify the user who sent the request whether or not the requested user will approve it? Optional: If there is no notification sent to the user who made the request, the requested user will have to wait for verification. For Example: Ima ...
In my custom styling setup, I have created a custom color class called text-green (colors) and a custom typography class called text-card-highlight (utilities), which includes font size and weight attributes. However, when using tailwind-merge, only one of ...
Is it possible to add a row to a table built with the jQuery library "Tablesorter" by simply clicking on a button? I have tried this approach, but unfortunately, the new row does not inherit the CSS properties of Tablesorter. As a result, I am unable to se ...
I am trying to center absolute items inside my .child_div element with a green background. How can I do this properly? .parent_div { position: relative; background: lightgreen; width: 1200px; margin: auto; } .child_div { position: relative; ...
Is there a way to make column [3] move up if column [2] is taller than column [1]? [1][2] [3][4] Check out this bootply example of the layout : http://www.bootply.com/KbAf8UOk9c Currently, there is empty space between column [1] and [3] that I would li ...
My slideshow smoothly transitions between images, with a logo positioned to partly overlay it. Everything looks great except for one pesky issue in IE6 - when the images change, the part of the logo that overlaps the slideshow also fades. I don't wan ...
Could jquery be used to calculate the height of ordered lists? I seem to be receiving a NULL value. js var tallestOl = $('ol.mostpopular').height(); console.log(tallestOl); html <ol class="mostpopular"> <li class="headin ...
I have integrated Datatables into my project and I am really interested in the "fnServerData" callback option. After reviewing the documentation Here, I came across the example code below: $(document).ready( function() { $('#example').dataTabl ...
Is it possible to set an element's height using CSS to match the window inner height without directly modifying its style with JavaScript? Can this be achieved by changing a CSS class with JavaScript? One attempted solution involved: document.getEle ...
I've been working on a small personal webapp and I'm facing an issue with a link that should trigger an ajax call to delete some information from a database. For some reason, the row is not being deleted as expected. I've tried troubleshooti ...
Currently, I am designing a responsive webpage utilizing Bootstrap framework. Situated in the center of the screen is a text that reads: <p id="entershop" ><a class=no-deco href="shop.html">enter shop</a></p> Within the Bootstra ...
This is my first time posting on stackoverflow, so please excuse me if I overlook something obvious. I tried searching for a solution beforehand but couldn't find one that seemed relevant. In the following jsfiddle example, I have a div that acts as ...
Can anyone help me with this code snippet? <div style="position: relative;"> /***main***/ <div style="top:0"> /*****Content1****/ </div> <div> /*****Content2****/ </div> <div> ...
How can I pass PHP dynamic parameters separated by commas to a JavaScript onclick function? Can someone assist me with the correct solution? The code below is not working as expected. echo "<td><a href='#' onclick='editUser(". $row ...
Similar Question: javascript how to reference parent element Hello everyone! This is my first time posting here. I have a question - how can I trigger alerts from a successful AJAX call? var page = { alerts: function (json) { if (json ...
I'm facing an issue with the left navigation bar's design. Specifically, I'd like the grey color of the bar to extend vertically across the entire page. Currently, the gray bar ends at the viewport's edge. Is there a way to make the ba ...
https://i.stack.imgur.com/DdUGj.png db.collection('User_Info').where("User_Name", "==", "Sam").where("PASSWORD", "==", "c2FtMTIzQA==").get().then(snapshot => { if(snapshot.docs.length > 0 ){ debugger; alert("Login Successful."); ...
I have a function that is making an AJAX call to return data. Here is the code: function reqNodelistByField( i ) { $.ajax({ type: 'post', url: './req.nodelist.by.field.php', dataType: 'text', ...
Can anyone assist me? I'm having trouble with the collapsible menu on my website not showing all three lists when clicked. I am using the following script link: src="http://code.jquey.com/jquery-1.11.2.min.js", or perhaps I have linked it incorrectly ...