Upgrade auf unsere Platinum service und erhalten Sie Ihre eigene maßgeschneiderte 3D-avatar
Bot Libre Forum

How to move the avatar in my website

durch magatlaw gepostet Oct 23 2018, 20:40

Hi, 
I'm new to using Bot Libre and I just tried embedding an avatar into my new website and I can't seem to move it by using position:absolute, top or left html codes

Here's my code

</div>
<divid="avatar"style="position:relative;left:300px;">
<scripttype='text/javascript'src="https://www.botlibre.com/scripts/sdk.js"></script>
<scripttype='text/javascript'>
SDK.applicationId = "6052012661363275013";
varsdk = newSDKConnection();
varweb = newWebAvatar();
web.connection = sdk;
web.avatar = "20697301";
web.voice = "dfki-prudence";
web.voiceMod = "default";
web.width = "250";
web.createBox();
web.addMessage("Welcome to Magos' E-Learning Website", "happy", "", "");
web.processMessages();
</script>
 
</div>


by admin posted Oct 24 2018, 11:56

The createBox() function in the embed JavaScript code is what add a <div id="avatar-avatarbox"> to the page for the avatar. The div is positioned as fixed on the bottom left by default.

You can change the position of the "avatar-avatarbox" element in css, such as a style tag, for example:

<style>#avatar-avatarbox { top: 10px; bottom: initial; right: 10px; left: initial }</style>

If you want to position the avatar inside a div in your page, then you either need to reparent it in JavaScript, or create the <div id="avatar-avatarbox"> with all the correct children (canvas/video divs) and not call the createBox() function.

To reparent the JavaScript code would be something like this (after the createBox() call):

<script>
var avatarDiv = document.getElementById("avatar-avatarbox");
var newParent = document.getElementById("my-avatar-div");
newParent.addChild(avatarDiv);
</script>

Thumbs up: 0, thumbs down: 0, stars: 0.0
Views: 506, today: 0, week: 1, month: 5

by magatlaw posted Oct 24 2018, 20:54

Thank you so much for replying.


Thumbs up: 0, thumbs down: 0, stars: 0.0
Views: 485, today: 0, week: 1, month: 8

Id: 24725425
Tags: avatar, web
Gepostet: Oct 23 2018, 20:40
Antworten: 1
Ansichten: 653, heute: 1, Woche: 2, Monat: 17
Ich bin mir sicher, dass
Flag post als anstößig oder in Verletzung der Regeln dieser Website