Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I want to move the content of a textbox to a Box when the ADD button is pressed as in the picture. Also, this text should be removed with an X button in the above box.
Picture
Any help is highly appreciated. Thanks in advance.
You can try this code:
// find elements
var box = $("#banner-message")
// handle click and add class
$('#add').on("click", function(){
box.append("<p>Some text <button class='text-more'>x</button></p>")
})
$("body").on('click', '.text-more', function(){
$(this).parent().remove()
})
This is a demo: https://jsfiddle.net/v24jh78b/1/
It can be done using the "click" function:
$(".addbutton").on("click", function(){
var x = $(".textbox").val();
$(".box").html(x);
})
And to remove it with the "x" button:
$(".xbutton").on("click", function(){
$(this).closest("div").find(".box").html("");
})
Let me know if it works
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
How would one be able to get a popup like the image below on hover of an element? I'm not sure what I should be adding in here apart from that I preferably don't want to use any other libraries apart from jquery. Please tell me if you need any code snippets or any more information!
Let's say you have said element above as a div on your page with an ID of 'cursor'. You can set the display value in your css to 'hidden', so it won't be displayed at first. When you hover over another element, you can trigger functions to display or hide said element:
<div id='hover-element' onmouseover='onMouseOver()' onmouseout='onMouseOut()'></div>
<div id=cursor'</div>
And then inside those functions:
function onMouseOver(element){
document.getElementById('cursor').style.display = 'block';
}
function onMouseOut(element) {
document.getElementById('cursor').style.display = 'none';
}
Try it :)
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
I would like to change my cursor after clicking on button (on whole page), and save it somewhere maybe in localstorage, beacause after refreshing or changing the page i still want to have this custom cursor.
I want to apply custom cursor with URL.
you can read about limitations and rules about cursor here
<button onClick="changeCursor()">Click Me!</button>
<script>
function changeCursor() {
document.getElementsByTagName('body')[0].style.cursor = "url('my-cursor.png'), auto";
localStorage.setItem('customCursor', 'true');
}
window.onload = function() {
if(localStorage.getItem('customCursor') == 'true') {
document.getElementsByTagName('body')[0].style.cursor = "url('my-cursor.png'), auto";
}
}
</script>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I'm working on a Text-Adventure port of The Stanley Parable, and one of the endings requires pressing a button for 8 hours. Instead of 8 Hours, I want the game to advance to the next link after 800 clicks on the link, any idea how I would code this?
Try this. Its simple but you get the idea. Rest you should try to accomplish yourself.
var clicks = 0;
document.getElementById('button').onclick = function(){
clicks++;
if(clicks == 5) {
window.location.href = 'www.yourlink.com';
}
}
<button id="button">
Click
</button>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Using Javascript and HTML, I am trying to have a series of buttons that when clicked on:
1) Dynamically create 3 sub buttons with different options
2) Once an option is selected, I want to remove the 3 new buttons and save their election out to a variable.
Essentially, I am trying to replicate what I am seeing done at http://interactiverenderings.com/.
Here is a JsFiddle
to get you started.
<div id="test"></div>
<script>
var dynamicBtn=document.createElement("BUTTON");
var buttonText=document.createTextNode("Hello...");
dynamicBtn.appendChild(buttonText);
document.body.appendChild(dynamicBtn);
dynamicBtn.onclick = function(){alert("Hi")};
</script>
You can do it the following way
var myDiv = document.getElementById("YOUR_DIV");
var btn = document.createElement("input");
btn.type = "button";
myDiv.appendChild(btn);
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I have something like this:
Vehicle Info
<script type="text/javascript">
function clickVehicleTab() {
$("#vehicle").trigger('click');
}
</script>
The function gets executed, however the jQuery to click the object doesn't seem to be executing successfully. What am I missing?
EDIT:
It appears the bind on the #vehicle object is a problem. It looks like this:
$('#jsddm > #vehicle').bind('click', openVehicleMenu); //vehicle menu click event
So the #vehicle can't be programattically clicked directly the way I'm trying.
A better way to do this would be adding an id to the link and using this to listen to the trigger event. Then when this is entered trigger the click-event on the element with the id "vehicle"
Vehicle Info
$(document).ready(function(){
$("#url").click(function(e){
e.preventDefault();
console.log('TEST: clickVehicleTab entered...');
$("#vehicle").trigger('click');
}
});
If the binding is done programatically why don't you just use:
openVehicleMenu();
instead of
$("#vehicle").trigger('click');