I'm currently working on a blazor webassembly project, where I have an iframe, which shows a livefeed from a camera. Is it possible to make this iframe, so the user can zoom in on the picture and move the zoomed picture sideways/up/down?
I'm imagining a google maps like frame with both the possibilities of scrolling/dragging to zoom/move. Is this something that can be done?
Thank you
Related
I have been searching google and I'm unable to find a website builder that offers such a feature.
So basically what I want is:
Initially on website load a certain zoomed out image is presented to the user and as the user scrolls down (through his mouse/touchpad) certain parts of the image are zoomed in one by one. Instead of the usual scrolling down a page, the scrolling down would instead zoom in on parts of an image, if that makes sense? Is this possible to do somehow?
I am creating a search page based on continents. And I need to let the user click(choose) a continent and based on this choice. I do backend logic.
What I tried is to set a world map as a background of a div. And on this map I put the linkbuttons that represent the continent (as attached).
The problem is when I resize the screen the linkbuttons go into wrong positions. So please help me to find a way to PIN the buttons (continent names) to the map when resize or open the page on different screens.
Thank you.
Here is a link to a youtube video that shows you how to use google maps API. This may make what you are doing a little easier. I recently used this to create a mobile tour app.
Google Maps API
Thanks for trying to help. I just solved the problem and likeed to share the solution.
I have solved this using map on the image. So I made the continents clickable on the image without putting any controls on the image.
I'm using this embedded iframe in my website (www.thatgolda.com):
playlist
The circled logo, when clicked, goes to a link that automatically downloads spotify. I'd like to know if there's some code I can use to change that link to my spotify artist page.
I'm not very familiar with javascript, so I'd appreciate an answer "for dummies."
Thanks in advance for your help.
GP
From the Spotify Play Button website (https://developer.spotify.com/technologies/widgets/spotify-play-button/):
Is there any way of customizing the design of the Spotify Play Button?
E.g. color, typography…
Currently there is no way no change the design of the Spotify Play
Button.
You can, however, use a Spotify Follow Button elsewhere on your website! The design is familiar for many users and clearly shows what the action of the button is.
https://developer.spotify.com/technologies/widgets/spotify-follow-button/
I have a track on my website which utilizes the soundcloud HTML5 player. I was wondering if there is any way I can make it a little quieter that way it doesn't shock the viewer upon opening my page. If anyone could lead me in the right direction as to how to alter the players volume on soundcloud it would be much appreciated :D
I know it has something to do with javascript: setVolume(volume) but I'm not familiar with JavaScript so if someone could help me out that'd be great. I want the volume to be at 50%.
If need be, i could also use the flash player.
I'm fine with using either HTML5 or flash player, I just want the volume to be set at 50% when someone plays it.
You can do this by using the Widget API
Basically, the widget is embedded into your page with an iframe. Give the iframe an id, include the API library (linked above) and then it's really simple.
SC.Widget('myIframeId').setVolume(50);
I've inherited a small project. The person before me created a native app for iPhone, implemented in objective-c, and my job is to remake it as a webapp with PhoneGap for iOS and Android.
In my predecessor's original implementation, part of the app has the functionality of allowing the user to drop a marker on a map to select a location. I found a comparable way of doing this, but the supervisor wants the exact way she'd done it, which I'm having a little trouble with. Let me describe:
In her native app, the map appears with a marker in the center of it. The user then slides the map around beneath the marker (which stays in place on the screen), until the marker is positioned over the spot they want. Then they hit a button marked "Select," and those coordinates are sent to the app for irrelevant other operations.
I'm trying to do the exact same thing with the google-maps javascript api and html/css, and I can't figure it out. Do any of you Gmaps pros have any ideas?
You may observe the center_changed-Event of the map. When it fires set the position of the marker to the new center of the map.
Another suggestion:
For a better effect instead of a marker you may use a custom control. You may insert a marker-image there so it will look like a marker. To place it in the center, push the control to
map.controls[google.maps.ControlPosition.RIGHT_CENTER]
(it will be vertically centered then) and apply the horizontal centering by adding a right-margin to the control